Showing posts with label Posts. Show all posts
Showing posts with label Posts. Show all posts

Friday, August 16, 2013

How to Change Blogger Posts a Comment Message

Change Blogger Posts a Comment Message:Providing People mind at the front side , they don't like any factor too much simple.Making any factor Innovative and Best of fortune is really a work which is significant "If You Can't Create it Excellent simply its look Good".You may have seen the concept "Post a Comment" at the end of Content ,isn't look awkward? I don't Like it ! Then Let's modify it ,Now How to Put it back , these days i will discuss an amazing technique via which you can place your desire picture there.Must apply it On Your Weblog if you love creativeness.

How To Change "Post a Comment Message in Blogger"


  • Go To Blogger Dashboard
  • Click On Template >> Edit HTML
  • Now Search for the below Code

 

  • You will find the below Code 



  • Now There Replace " " in the above mentioned script to the desired image script or select any code from the below images.

First Image Script

2nd Image Script 

3rd image Script 

 4th Image Script

5th Image Script 

---Replace the Above mentioned Code with any one of these images and enjoy the awesome look of comment section,if you have any Question in your mind ask us freely.Happy Blogging!

How to Change Blogger Posts a Comment Message

Rating: 4.5

Sunday, September 16, 2012

Add Facebook Send and Like Button To Posts In Blogger

Facebook send and likeI am going to show you an easier way to like and send / share your posts with just one click. User will be more attracted to like your posts while reading or after reading article. If readers loved your post much, they will even send it to their friends on facebook. Facebook has combined the like and send button into a single plugin. This widget will took less time and less space but will work greater for you.


Add Facebook Like and Send Button To Blogger Posts

1. Go to Blogger Dashboard > Your Blog > Template > Edit HTML
2. Backup your template.
3. Check the box of expand widget template.
4. Search for <data:post.body/>.
5. Now if you want to add the plugin at the end of posts, then add the following code below <data:post.body/>. If you want to add the plugin just below post titles, then add the below code before <data:post.body/>.
<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:like href="" send="true" layout="button_count" width="450" show_faces="false" font=""></fb:like>
6. Now save your template and you're done !
Enhanced by Zemanta

Friday, July 13, 2012

How to Add a Post Divider Between Blogger Posts

In today's Blogger tutorial I show you how to enhance your Blogger blog (Blogspot blog) by adding a post divider to your Blogger template. Used effectively post dividers can really jazz up your blog and will lend it that individual feel which most of us are hoping to create.

This tweak is very easy and well within the capabilities of any Blogspot blogger. Only a few simple changes to your Blogger template are required and these are in the CSS styling section.

How to add a post divider between posts in Blogger
By way of example I will use a divider that I downloaded from the internet free by searching for free divider graphics. Here are some sample dividers you can use to get started:


URL address:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCIyxYJpVdiVXShLbbHEtxiTmoXmin9BhBYdjFan0KAkX01iLMP_4weKDgfGEC4fORAuGl6V_DFBmEj14O5fZZVjPg8Fgjr0HgiBsd6O5yXWbxLaGF1_8Ixiof1x_Sgsdjrbcsyv3RBeA/s400/ribbon.gif


URL address:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgb9B-bQWOyOGBrySeQ8ibLvP9KXvU1O_XY-O3WOl_fZZvQpbeqE4LfDzvPHyyLMowslQZmvpgbTbQ5beoDFQr6u3wDsHhbSzc7PedJFynCDdTvLOAdwT6hjHlXznZeGKNPPx6PS_bh-tE/s400/bar1.gif


URL address:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHauQ-4efOmHP2muQdHASNuCksgNOmtCgrz-PGgrnokXtf3IQXzJMDqM1B_uvLHpGpVVv3WkXdN3Qny4m_a-StgVFm6mQIl7W6GebHcakcBFVC4KNil23eHcrHO8ufnSAp-g42bKizJcM/s400/barbsmpl.jpg


URL address:
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiuvvpmUzmaiyJ2csb5iTq5KCsp3B8pTmrTsnZaTjuLvmwW67EOU5ZP3FAHlb6s0p5gqbyg_goDgJHjGCMK5lxEj1Qi9oM_O1buZGUvfOlOFZwYR_GyZ8iCo7r2wdZgavRgE3LXW8vuiLI/s400/bar47.gif


How to Add a Divider Between Posts in Blogger

  1. Login to Blogger if not already logged in

  2. From the Dashboard navigate to Layout > Edit HTML

  3. Back up your Blogger template as a precaution by downloading it to your computer

  4. Find the following line of code in your template:
    .post {

    You are likely to have something like this in your template already:

    .post {
    margin:.5em 0 1.5em;
    border-bottom:1px dotted $bordercolor;
    padding-bottom:1.5em;
    }

  5. Paste the following lines of code to this block making sure you paste them before the closing curly bracket:
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCIyxYJpVdiVXShLbbHEtxiTmoXmin9BhBYdjFan0KAkX01iLMP_4weKDgfGEC4fORAuGl6V_DFBmEj14O5fZZVjPg8Fgjr0HgiBsd6O5yXWbxLaGF1_8Ixiof1x_Sgsdjrbcsyv3RBeA/s400/ribbon.gif);
    background-repeat: no-repeat;
    background-position: bottom center;
    margin:.5em 0 1.5em;
    padding-bottom:1.5em;

  6. If any lines are duplicated remove them.

  7. Remove any line beginning with: border-bottom: eg

    border-bottom:1px dotted $bordercolor;

  8. You will now have a block of code which looks like this plus any extra lines from the existing code in this block:
    .post {
    background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCIyxYJpVdiVXShLbbHEtxiTmoXmin9BhBYdjFan0KAkX01iLMP_4weKDgfGEC4fORAuGl6V_DFBmEj14O5fZZVjPg8Fgjr0HgiBsd6O5yXWbxLaGF1_8Ixiof1x_Sgsdjrbcsyv3RBeA/s400/ribbon.gif);
    background-repeat: no-repeat;
    background-position: bottom center;
    margin:.5em 0 1.5em;
    padding-bottom:1.5em;
    }

  9. Click on Save Template to save your changes

  10. Click on View Blog to see your new post divider between posts
Tips and Troubleshooting
  • To change the divider to one of the above replace the URL address of the image (in red) with the URL address of the new image you want to use.

  • To use your own divider image download to your computer from the internet and then save the image to a photo image service like Photobucket. Replace the divider image URL address (in red) with the URL address of your new image

  • To increase the padding around the divider change the following line of code:

    padding-bottom:1.5em;

    to

    padding-bottom:2.5em;
In today's Blogger tutorial you have learned how to insert a divider between your Blogger posts to enhance the look of your Blogger template (Blogspot template). You can either make your own post divider or download one from the myriad of free website dividers available on the net.

Monday, July 2, 2012

How to Add Internal Links Within Blogger Posts


  • Each link identifier needs to be enclosed in inverted commas. Make sure to match up the correct identifier with the one created in step 6



  • Using this anchoring structure our first anchor becomes:

    <a name="withinposts">How to Create Internal Links To Sections Within the Same Blogger Post</a>

    Substitute your own link identifier and headings
  • Now move on to the next point you want to link to and create the second anchor. In this example we use the same structure but change the identifier

    <a name="withinblogger">How to Create Internal Links To Sections Within Different Blogger Posts</a>

    Again substitute your own link identifier and headings to suit your article

  • Save and Publish as normal and you will see your links are live and will jump the reader to different parts of the post


  • Now you know how to create links to sections within Blogger posts let's look at how to create internal links within different Blogger posts.

    Most of you will be able to create a link to another post in Blogger using the posts editor. You just highlight the text you want and click on the figure eight icon and Blogger creates the link for you. Which is great most of the time.

    However what if we want to direct the visitor to a particular section of a different post? When you create an internal link it will take the viewer to the top of the page but what if you want them to see something near the end of the article? Well using an internal link similar to what we did to create internal links within the post we can.

    Say I want to take my reader to a particular post in this case The 10 Great SEO tips for your blog or site. How would I go about it?

    1. I create the link as usual by copying the article URL address from the browser address bar and using the post editor to add the link. The Blogger post editor uses this structure:

      <a href="URLaddress">linkname</a>

      So the Blogger editor would create the following link:

      <a href="http://free-seo-tricks.blogspot.com">Blogger SEO Tips and Tricks</a>

      The link would appear like this in a browser:

      Blogger SEO Tips and Tricks

    2. Now I want to direct my visitors to the section about creating breadcrumb navigation so I add a section name using the following structure:


      <a href="URLaddress#identifier">linkname</a>

      Thus my link would look like this in the Edit HTML section of my post editor

      <a href="http://free-seo-tricks.blogspot.com#breadcrumb">Blogger SEO Tips and Tricks</a>

      Note the link seen in a browser remains the same


    3. If you want your link to open in a new browser window add the following to your link:

      <a href="http://free-seo-tricks.blogspot.com" target="_blank">Blogger SEO Tips and Tricks</a>


    4. Now I need to go to the post I am linking to and add the anchor. So in the post SEO Tips and Tricks I would use the following structure to link to the section about how to add breadcrumbs:


      <a name="identifier">a heading</a>

      So the section about breadcrumbs in the Blogger SEO Tips and Tricks article is now enclosed by the following:


      <a name="breadcrumb">Add Breadcrumb Navigation to your Blogger Blog</a>

    5. Save your changes and publish your article as normal

    In this Blogger tutorial you have learned how to add internal links to a particular section of a post from both within the same Blogger post and within a different post. By adding internal links you will help your visitors to find their away your blog more easily and access information quickly. You will also be adding to your blog's SEO by linking related posts.


    Thursday, June 28, 2012

    How to Align and Justify Blogger Posts


    Skill Level: Beginner Rating: Easy Time: 1 Minute

    Before you rush off to download a custom Blogger template consider customizing your existing Blogger template.

    This tutorial is part of a series of articles that I will publishing over the coming weeks about customizing your Blogger template using CSS styling. I will be targeting beginner bloggers and newbies to Blogger as well as more seasoned bloggers so if you want to spice up your Blogger template please read along.

    How to Justify Blogger Posts (Blogspot Posts) Using CSS
    It is easy to change the text alignment of your Blogger posts with the addition of one extra line in the CSS styling section of your Blogger template (Blogspot template). By default the alignment is set to left align so that the text aligns to the left while the right edge is ragged. You can also have right alignment where the text aligns to the right and the left edge is ragged.

    Another not so common option is to justify the text so that both left and right edges are straight. Users of MS Word and other word processing programs will be familiar with justify as an alignment choice. Justify stretches out the text so that each line has an equal width similar to what you will find in newspapers and magazines. I have found justifying my Blogger posts to be a useful feature on several of my blogs and thought some of you might to. Below are instructions on how to justify your Blogger posts so that all your blog's articles are justified but first take a look at the difference in presentation of these 2 blog posts just by justifying the alignment of the text. Makes a big difference don't you think?

    Blogger post text is left aligned
    Blogger post text is justified

    1. Before you start check how text is currently aligned on your Blogger posts. If it is left aligned you will be able to follow this trick to justify it. If it is already justified no need to go any further.

    2. Login to Blogger if not already logged in

    3. From the Dashboard click the Layout link for your blog and then click on Edit HTML

    4. Back up your template by downloading it in full as a precaution

    5. Use CTRL + F to find the code block beginning with .post in the CSS styling section of your Blogger template. As templates will differ greatly there are no hard and fast rules about what styling will be in this block. Here is a typical code block taken from the default Minima Blogger template

      .post {
      margin:.5em 0 1.5em;
      border-bottom:1px dotted $bordercolor;
      padding-bottom:1.5em;
      }

    6. Add the following line to the code block before the end brace (the end curly bracket)

      text-align:justify;

      so that your code now looks like:

      .post {
      margin:.5em 0 1.5em;
      border-bottom:1px dotted $bordercolor;
      padding-bottom:1.5em;
      text-align:justify;
      }

    7. Click on Save Template

    8. Click View Blog to see the alignment of all your posts has now changed to justified

    Tips and Troubleshooting
    1. If your Blogger template justifies posts and you would like to left align them find the code beginning with .post in your Blogger template and add the following line to the block:

      text-align:left;

      so that your code now looks like:

      .post {
      margin:.5em 0 1.5em;
      border-bottom:1px dotted $bordercolor;
      padding-bottom:1.5em;
      text-align:left;
      }

    2. If you want the posts right aligned you would substitute the word right for left.

    In this tutorial you have learned how to justify your Blogger posts to create a straight rather than ragged margin edge. By using this tip to add one line of code to your Blogger template you can enhance the look of your Blogger posts. This tweak only takes a minute but can markedly improve the presentation of your Blogger posts. Please keep reading along for more CSS tips and tweaks in the coming weeks.


    Sunday, June 24, 2012

    How To Publish Your Posts To Facebook Page Automatically


    How To Publish Your Posts To Facebook Page Automatically

    Facebook is the best social networking site which is widely used in the world.
    Every blogger give first priority to sharing his/her site on Facebook. now I am going to teach you the easiest and fastest way to publish your blogger posts automatically on your website's Facebook fan page.
    Now a days no one has much time to manually publish all blog posts on Facebook page too. But I'm glad you're here at the right place to learn that trick.

    horizontal random post

      Random Posts...!!!