Showing posts with label How to. Show all posts

Tuesday, July 17, 2018

Professional Projects Working with google blogger platform

Are you Sure you cant make amazing projects and Professional work using google bloger platform ???. If you are Absolute sure for that you must see this istogrami.blogspot.gr and https://webtemplate365.blogspot.com/

Sunday, May 13, 2018

Reaction Buttons for Blogger using Vicomi

Reaction Buttons for Blogger - here is another big and very useful blogger widgets. You can show reaction buttons on your blogspot blog. Reaction is a smart way for your visitors to leave feedback without leaving any comments. Here is very simple way to add recation buttons for blogspot blogger using vicomi.com.

You can discover lots of awesome blogger widgets by msdesignbd. Now lests starting the tutorial.

LIVE DEMO

Step1: Go to vicomi.com
Step2: Now signup with your Blog title, e-mail and your website.

Step3: Now choose your emotion design and click Done.
Step4: Now copy the code.

Step5: Now go to Edit HTML and find <data:post.body/>
Step6: Past copied code right after <data:post.body/>

Resource https://www.msdesignbd.com/2016/11/reaction-buttons-for-blogger.html

Saturday, May 12, 2018

How To add Gadget inside Blogger Blog Header

Step-1 (Default Header Layout):
Login into your blogger account and visit theLayout section of your blog to see the header position whether it is single or has already been divided. Here is screenshot for the default blogger blog header.

If your blog contains only one column in header section as above, then follow the next steps to divided it into two parts.

Step-2 (Template Editor):
Go to the Template section of your blog and click on Edit HTML text button next to the Customize button. See the screenshot for template Edit HTML button.

Step-3 (Edit Template):
Click on Jump to widget from the top drop down menu and select Header1 as shown in this screenshot.

Step-4 (Delete Default Header Section):
You will see codes which represents default blogger blog header section.
Now, delete all these codes so that the older header section will be deleted.

Step-5 (Insert New Header Section):
Copy and paste these HTML codes in place of old header section deleted codes as shown in this screenshot.

<!-- SWT Header Section START --><div class='region-inner swt-header-inner'> 
<b:section class='header-left' id='header-left' maxwidgets='1' name='Header-Left' showaddelement='yes'/> 
<b:section class='header-right' id='header-right' maxwidgets='1' name='Header-Right' showaddelement='yes'/> 
</div><!-- HELP: http://www.superwebtricks.com/display-adsense-in-blog-header -->

Don’t delete the HELP URL address from the last line of above code as it may help you in future for any updated tutorial and code upgradation.

Step-6 (CSS for New Header Section):
Now, press Ctrl + F for search the

]]></b:skin>

and paste the following CSS codes above/before it.

.swt-header-inner { /* HELP: http://www.superwebtricks.com/?p=570 */ 
width: 100%; display: flex; 
} 
.header-left { 
width:50%; 
margin:0; 
padding: 0; 
float:left; 
overflow:hidden; 
} 
.header-right { 
width:50%; 
margin:0; 
padding: 0; 
float:right; 
overflow:hidden; 
/* Blog Header inserted by www.superwebtricks.com */}

See the screenshot here.

Now, click on Save Template to save the all avobe steps in your blog template.
Customization: You may adjust the width of Header-Left and Header-Right section in accordance with the title/logo of your blog or the size of AdSense Ads to be displayed.
You may also specify the width in pixel instead of percentage. Suppose you want to show your blog LOGO (70px) on the left side and insert AdSense codes (728px) on the right side in header section. Replace the CSS codes of header-left width:70px;and header-right width:730px; depending of your blog layout width (800px).
Step-7 (Insert New Gadget):
Navigate the layout section of your blog to see the difference. Here is the screenshot.T

Resource http://mrad4tech.blogspot.gr/2016/10/how-to-add-gadget-inside-blogger-blog.html

How to add Gadget inside Blogger Blog Header for AdSense Ads

Recently, we have learned to create and insert AdSense Ad code into Blogger Template in a very precise manner. After reading that tutorial one reader asked me to add a Gadget inside the blogger blog header for the purpose of displaying AdSense Ads.

That was very interesting for me as because there is no any option in default blogger template or even many customized blogger premium/free templates available on internet to add a new Gadget inside the header slot rather you can’t even move the header widget from its default place.

Most of blogger wants to insert their AdSense codes or any direct advertiser’s Ad banner into the blog header because this space is above the fold, more eye catching and gets maximum number of impressions.

Therefore, today we will learn the tricks to add a new widget next to the Blogger header just besides your blog logo or title or description for the purpose of either displaying AdSense Ads or for adding any other third party HTML/JavaScript codes.
How to Divide Blogger Blog Header into Two Parts

Before we start editing blogger template, I strongly recommend you to backup your blog template for future reference on the safe side. Now, follow the following steps very carefully so that you can easily divide your BlogSpot blog header into two parts in first attempt.
Step-1 (Default Header Layout):

Login into your blogger account and visit the Layout section of your blog to see the header position whether it is single or has already been divided. Here is screenshot for the default blogger blog header.

If your blog contains only one column in header section as above, then follow the next steps to divided it into two parts.
Step-2 (Template Editor):

Go to the Template section of your blog and click on Edit HTML text button next to the Customize button. See the screenshot for template Edit HTML button.

Step-3 (Edit Template):

Click on Jump to widget from the top drop down menu and select Header1 as shown in this screenshot.

Step-4 (Delete Default Header Section):

You will see the following (Screenshot) codes which represents default blogger blog header section.

Now, delete all these codes so that the older header section will be deleted.
Step-5 (Insert New Header Section):

Copy and paste these HTML codes in place of old header section deleted codes as shown in this screenshot.

<div class='region-inner swt-header-inner'>
<b:section class='header-left' id='header-left' maxwidgets='1' name='Header-Left' showaddelement='yes'/>
<b:section class='header-right' id='header-right' maxwidgets='1' name='Header-Right' showaddelement='yes'/>
</div>

Don’t delete the HELP URL address from the last line of above code as it may help you in future for any updated tutorial and code upgradation.
Step-6 (CSS for New Header Section):

Now, press Ctrl + F for searchthe ]]></b:skin> and paste the following CSS codes above/before it.
.swt-header-inner { /* HELP: http://www.superwebtricks.com/?p=570 */
width: 100%; display: flex;
}
.header-left {
width:50%;
margin:0;
padding: 0;
float:left;
overflow:hidden;
}
.header-right {
width:50%;
margin:0;
padding: 0;
float:right;
overflow:hidden;
/* Blog Header inserted by www.superwebtricks.com */}

See the screenshot here.

Now, click on Save Template to save the all avobe steps in your blog template.

Customization: You may adjust the width of Header-Left and Header-Right section in accordance with the title/logo of your blog or the size of AdSense Ads to be displayed.

You may also specify the width in pixel instead of percentage. Suppose you want to show your blog LOGO (70px) on the left side and insert AdSense codes (728px) on the right side in header section. Replace the CSS codes of header-left width:70px; and header-right width:730px; depending of your blog layout width (800px).
Step-7 (Insert New Gadget):

Navigate the layout section of your blog to see the difference. Here is the screenshot.

Now, you may click on Add a Gadget for adding your Page Header widget in your blog and AdSense Ad Unit codes or any third party HTML/JavaScript codes. Here is the screenshot for your help.

If you have any problem in following the above steps or you are getting any error then, please feel free to ask your query through comment below.

Resource: https://www.superwebtricks.com/display-adsense-in-blog-header/

Sunday, November 5, 2017

Google Blogger: How to Customize Post Footer

When you are new to blogger you want to customize your blog according to your choice such as add a stylish menu bar for your blog,Customize your post footer options and much more.You can customize in four different ways.we are going to explain all of them

Add/Remove Basic Post Footer Options
This facility is already provided by the blogger you have to some simple steps to do so

Steps
1.Go to Blogger Dashboard>Layout.
2.Now in Blog Posts click on Edit option

There you find all the options related to Post page and Post footer
some basic customizations are

- Add/remove share buttons
- Customize number of posts displayed on homepage
- Enable/disable reactions
- Showing off location
- Displaying number of comments on footer
- Showing author name
- Customize date and time displayed on footer

After customizations Now click on Save.

Remove Post Footer from Homepage/Index Page
If you want to remove post footer options from your homepage you have to add a CSS code to your templet.

Steps
1.Go to Blogger Dashboard>Templet>Edit HTML.
2.Now press Ctrl+F and find ]]></b:skin>
3.Now paste the below given code after ]]></b:skin>

<b:if cond='data:blog.pageType == "index"'>

.post-footer {display:none !important;}

</b:if>

</style>

Preview your blog to confirm changes and Save template.

Remove Post Footer from Post and Static Pages
If you are like to disable your post footer from other pages while keeping it on homepage, you can try below method.

1.Go to Blogger Dashboard>Templet>Edit HTML.
2.Now press Ctrl+F and find ]]></b:skin>
3.Now paste the below given code after ]]></b:skin>

<style type='text/css'>
<b:if cond='data:blog.pageType != "index"'>
.post-footer {display:none !important;}
</b:if>
</style>

Preview your blog to confirm changes and Save template.

Remove Page Footer Completely from your Blog
you can also remove your post footer completely from your blog.
you can also put post footer below post title with different style

1.Go to Blogger Dashboard>Templet>Edit HTML.
2.Tick on, Expand Widget Templates.

3.Now press Ctrl+F and find .post-footer

4.Now paste the below given after after .post-footer

display:none !important;

i.e: .post-footer {

display:none !important;

........................................

}

5. Now Save your template.

Resource http://way2bloggerz.blogspot.gr/2012/04/how-to-customize-post-footer.html

how to resize a embedes video in your blog

Today i show you how to resize a embedes video in your blog , all we know that the embeded youtube video in bloger is extreamly small size and the user who wach the video cant enjoy the video, but no more , here is the solution :

Luis Fonsi - Despacito ft. Daddy Yankee

STEP 1:
First of all ue use HTML mode

STEP 2:
Press CTRL+F and searc for Youtube

Now set: width="640" height="430" or your NEW video size !!!

Done !!!

STEP 3: IMPOTRANT !!! Press play on this post to enjoy despacito !!!

Friday, September 29, 2017

How to create a Navigation post and Navigation Toolbar witout code

Navigation Alternative Toolbar witout code
As front end page developers we have a problem with Upper navigation toolbar when the user activate the google translate so we make a alternative navigation system , who some times looks awesome !!!

This Alternatine Navigate System help the blog visitors to have a alternative nav option ,
This Alternatine Navigate System help you to have some new blog control methods shrink to some simple posts !!! this is a very simple 5 click method wit out coding

1) Make some Navigation posts and label it «Navigate

Order the Navigation button to be FIRST in the labels list...

That's it Congratulations !!!! you have a new Navigation system - and Navigation posts ...

Bonus Tips :
You can make your navigation posts stick using a simple trick . Publise the posts using a future date :

Bonus Tips :
In your Navigation posts you can add a simple Fixed buttons or menu Toolbar:

#1. Using a simple word processor like MsWord 2016 ( We Will post about that soon !!! ):

You can use a Word Processor to make fixed buttons without coding...

Very easy and simple and fast way to make beautiful Fixed buttons and insert the buttons as PNG or JPG in to your Post ( Create a new post ) and link your PNG without code. Also you can copy that buttons to a simple : Text widget but this is not into the point.

#2. Or you can use a Multiple CSS MENU style ( CSS/HTML Code method ) :

#3. Or you can use a online button builder:
https://bootsnipp.com/buttons
http://buttonoptimizer.com/#
https://dabuttonfactory.com/
http://css3buttongenerator.com/

#4. Or you can use a online menu builder:
http://www.cssmenubuilder.com/
http://bootstrapdesigntools.com/
http://www.cssportal.com/css3-menu-generator/
http://cssmenucreator.com/
http://www.onlycssmenu.com/
http://codefuture.co.uk/menugenerator/
http://www.generateit.net/menu-generator/index.php
https://bootsnipp.com/snippets/rvB4g
http://www.dropdownmenugenerator.com/Generator.asp Payd
webstore/detail/swimbi-css-menu-maker/ Chrome addon Payd

#5. Or you can download a menu builder software:
https://mobirise.com/
http://purecssmenu.com/
http://swimbi.com/download/
https://wonderwebware.com/css-menu/
http://swimbi.com/download/ Payd
https://www.easycssmenu.com/ Payd

All methods work great !!!

Bonus code :
if you like the button zoom effect add this code in to the start of your post:

<style media="screen" type="text/css">
.post img{
-webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease;
}
.post img:hover {
-o-transition: all 0.6s;
    -moz-transition: all 0.6s;
    -webkit-transition: all 0.6s;
    -moz-transform: scale(1.1);
    -o-transform: scale(1.1);
    -webkit-transform: scale(1.1);
}

</style>

Tags CSS Button builder CSS Menu Generator CSS Tab Designer

Tuesday, September 26, 2017

How to display a RSS feed With pictures in a post or widget

Visit https://feed.mikle.com/my/widget/create/

Step 1 Enter your RSS feedburn URL
Step 2 Sepup your RSS Wiewer
Step 3 Get the code as Javascript or as IFRAME

Ok the your RSS feedburner URL is here: Click the Widget RSS SUBSCRIBLE TO / Atom and copy the XML page address usualy is: http://your blog name/feeds/posts/default

Thank you !!!

Monday, September 25, 2017

How do I create a Blogger Feed?

Enter your blog's web address in the "Ready to Burn?" form found on FeedBurner's homepage and at the bottom of the pages in the Blog and Podcast sections. If you plan to publish a podcast with your Blogger feed, check the "I am a podcaster" box. Click Next ».

The Identify Feed Source page should appear.
On "Welcome", make sure the title and FeedBurner address (URL) of your new feed are values you prefer.
The Create or Sign In To Your FeedBurner Account page should appear.
Also on this page, create a FeedBurner account by picking a username and password and supplying your email address.
When you've supplied all the required information on this page, click Activate Feed ». A "Congrats" page should appear.
Read all of the information on "Congrats", then click Next » to continue with the setup process.
If you selected "I am a podcaster" on the homepage, configuration options for our SmartCast service will appear. Here you can supply categories and other information for iTunes, append a copyright message, and submit your podcast to Yahoo! Search.
When you are finished, click Next ». Configuration options for FeedBurner stats services should appear.
On the stats configuration page, select the level of feed stats detail you want.
Click Next » to finish the setup process and enter our feed management interface.
You're now ready to make your FeedBurner feed available on your Blogger site!

Tracking 100% of your feed traffic: Redirecting your Blogger feed to your FeedBurner feed

Blogger can make sure all feed traffic for your blog content goes to your FeedBurner feed. This ensures your FeedBurner stats are comprehensive and accurate; even subscribers to the 'Original Feed' are routed through FeedBurner. To redirect your feed:

In a new browser window, sign in to your Blogger account.
From the Blogger Dashboard, click the Settings link for the blog you want to promote.
The Settings page for your selected blog should appear.
Click the Site Feed link under the Settings tab.
Type your complete FeedBurner feed address into the Post Feed Redirect URL text field. Make sure you type in your entire feed address including the "http://" portion.
Click Save Settings.
You should see the message "Settings were Saved Successfully".
Blogger will now redirect all feed traffic for your blog to your FeedBurner feed.
Note: If you are using the redirection feature within Blogger to send all of your feed traffic to your FeedBurner feed, you may want to modify the code we provide in order to keep your subscribers with you, even if you leave FeedBurner.

How To Create Blogger RSS Feed With Feedburner- Blogger Tutorial

Troubleshooting

Step1: Important !!! First of all http://www.feedvalidator.org/ to see your problem and focus

If everything is ok !!! move to the next step:

Step2: Do not use the widget embed method but

Step2B: Copy the code below in a Html/javascript widget

Step2C: And paste the cone in the HTML box ...

Resource

https://www.blogger.com/
https://www.youtube.com/watch?v=ZejteY-SaXI

Wednesday, September 20, 2017

How To Backup Images of Your Blogger Blog Hosted at Google Photos

Images are considered as one of the core elements of a website. Without relevant images, a website looks like an old novel that has clusters of text all around. The peoples of this generation are more interested in images than content. Since, Blogger is a Google property, so all the images that you upload on your site are hosted at Google Photos Web Album. What would happen if Google suddenly removes your all images due to some violating in their policies? It would be a nightmare and without having an image backup even worse. Therefore, today in this article, we will show you How to Backup All Images of Your Blogger Blog from Google Photos.

To back up the images which are uploaded on your blog, first go to Google.com/takeout/?pli=1#custom and select Google Photos web albums from the list of Google services.

Now it will take you to a new page from where you can download all of your Google Photos albums or can even select a single album. From the configuration tab, you can select a specific blog or can even download your all albums. Once everything is finalized press “Next” button and proceed to the next step.

Now a new wizard will take place which would calculate all images hosted at your particular blogger site. Once the progress bar reaches to complete, press the “Create archive” button to start downloading the backup of your images.

After downloading the database successfully, you can unpack the files which would reveal the backups of your all images which you uploaded on you blogs arranged in an alphabetical order. Seems like, mission accomplished!

By using the same way, you can back up the database of your all Blogs at once. Moreover, Google Takeout is a remarkable free-to-use service. If you liked this article then feel free to share it with your friends through Facebook, Twitter or any other platform.

Resource http://www.mybloggerlab.com/2013/03/how-to-backup-images-of-your-blogger-blog.html

Sunday, September 17, 2017

How to Make Blogspot Redirect to Another Site

Because of its flexibility and ease of use for nonprogrammers, Google's Blogspot hosting service, provides an excellent platform on which to start a blog.

However, if you've moved your blog to another hosting service or you've started a website on another hosting account, you may want to take your regular readers with you to your new site.

By inserting a simple snippet of HTML code in your old blog's template, you can automatically redirect your old blog's visitors to your new website.

1. Log in to your Blogger account and click the blog you want to redirect to another site.

2. Click the "Theme" tab on the left menu.

3. Click the "Edit HTML" button in the main panel.

4. Locate the <head> tag in the header section and insert the following code after the <head> tag:

<meta http-equiv="refresh" content="0;URL='http://www.yoursite.com/'" />

Replace "http://www.yoursite.com" with the URL of the website to which you want to redirect your blog.

5. Click the "Save Template" button.

6. Click the "View Blog" button to test if the redirect code correctly redirects your blog's visitors to the site you want.

Resource http://blogtimenow.com/

Friday, September 16, 2016

Google Bloger: How to Customize the Post Footer

The Post Footer contains many elements like the Posted by line, the timestamp, the labels, comments, backlinks and others which you can customize to your blog.

The primary customization can be made by going to Template >> Page Elements >> Click the Edit link in Blog Posts section >> In popup window choose which items you would like to appear in the post footer by putting a check on their names. See picture below (Click on picture to enlarge it)

CHANGE NAME OF AUTHOR

To change the name of the author you can go to Dashboard >> Edit Profile >> dentity >> Display Name >> Change Name and Save. However if you want to show different names under the posts you can change it in the template. To do this go to Template >> Edit Html >> First backup template using Download Full Template link given on this page.>>Then put a check in Expand Widgets Template text box and scroll down to locate this code in the Blog Posts widget :

<p class='post-footer-line post-footer-line-1'>
<span class='post-author'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/> <data:post.author/>
</b:if>
</span>

Delete <data:post.author/> in the fourth line and substitute your nickname. Preview and Save Template.

INSERT AUTHOR PICTURE IN POSTED BY LINE

Delete the same piece of code in the above example and insert this line :

<a href="URL OF BLOG"><img src="URL OF YOUR PICTURE" /></a>

Preview and save template.

APPEARANCE OF LABELS

To change the appearance of your labels go to Template >> Edit Html >> First backup template >> Add this code between <b:skin>![CDATA[ and </b:skin> tags in your template :

.Label {
color:#b4h6td;
background:#afafaf;
xxxxxxxxxxxxxx
}

Add other properties instead of line xxxxxxxxxx just as you do in normal CSS. The CSS in old blogger and the new blogger is the same except that it is enclosed in b:skin tags in case of the latter. Preview and save template.

CHANGE THE NAME "LABELS" BELOW YOUR POST

The Labels are indicated below your posts starting with the term "LABELS". If you wish to change this name to something else like "CATEGORIES" locate this piece of code by going to Template >> Edit Html >> Put Checkin Expand Widget Templates check box and >> Scroll down in Edit Template text box till you come to :

<p class='post-footer-line post-footer-line-2'>
<span class='post-labels'>
<b:if cond='data:post.labels'>
<data:postLabelsLabel/>
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
</b:loop>
</b:if>

Delete the line in red in above code and replace with whatever name you want like CATEGORIES for instance.

REPLACE THE NAME "LABELS" BELOW YOUR POST WITH AN IMAGE

First upload your image to a free host like Googlepages and obtain its URL/link. Then locate the code line in red in above code where it was replaced with the word CATEGORIES. Replace that line with this code:

<img src="URL OF IMAGE AT FREE HOST" alt="BLOG TITLE" />

Preview and Save.

CHANGE OLDER POSTS AND NEWER POSTS TEXT

To change the wording of these links go to Template >> Edit Html >> Backup your Template >> Put check in Expand Widgets Template box >> Scroll down in Edit Template text box till you come to this code :

<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl'
expr:id='data:widget.instanceId + "_blog-pager-newer-link"'
expr:title='data:newerPageTitle'><data:newerPageTitle/></a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl'
expr:id='data:widget.instanceId + "_blog-pager-older-link"'
expr:title='data:olderPageTitle'><data:olderPageTitle/></a>
</span>
</b:if>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link'
expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link'
expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>
</div>
<div class='clear'/>
</b:includable>

CHANGE THIS CODE TO :

<b:includable id='nextprev'>
<div class='blog-pager' id='blog-pager'>
<b:if cond='data:newerPageUrl'>
<span id='blog-pager-newer-link'>
<a class='blog-pager-newer-link' expr:href='data:newerPageUrl'
expr:id='data: widget.instanceId + "_blog-pager-newer-link"'
expr:title='data:newerPageTitle'>OPEN NEXT POST</a>
</span>
</b:if>
<b:if cond='data:olderPageUrl'>
<span id='blog-pager-older-link'>
<a class='blog-pager-older-link' expr:href='data:olderPageUrl'
expr:id='data:widget.instanceId + "_blog-pager-older-link"'
expr:title='data:olderPageTitle'>OPEN PREVIOUS POST</a>
</span>
</b:if>
<b:if cond='data:blog.homepageUrl != data:blog.url'>
<a class='home-link'
expr:href='data:blog.homepageUrl'><data:homeMsg/></a>
<b:else/>
<b:if cond='data:newerPageUrl'>
<a class='home-link'
expr:href='data: blog.homepageUrl'><data:homeMsg/></a>
</b:if>
</b:if>
</div>
<div class='clear'/>
</b:includable>

Preview and save

You can also add a forward arrow image and a backward arrow image by adding this code in the same place above

<a href="URL OF BLOG"><img src="URL OF YOUR ARROW PICTURE" /></a>

For full details see http://betabloggerfordummies.blogspot.com Making Image Links.

DELETE THE OLDER POSTS AND NEWER POSTS LINK

To completely delete the Older Posts and Newer Posts links locate this line of code in the Blog Posts widget after putting a check in the Expand Widgets Template check-box :


<b:include name='nextprev'/>

Delete this code. Preview and Save.

ADD SUBSCRIBE TO COMMENTS (ATOM)

Below your posts is the link to subscribe to posts Atom feed. You can add a
Subscribe to: Post Comments (Atom) link. To do this go to Template >> Edit Html >> Put a check in box for Expand Widgets Templates and scroll down till you come to this code in the Blog widgets section :


<div class='post-feeds'>
<b:loop values='data:posts' var='post'>
<b:if cond='data:post.allowComments'>
<b:if cond='data:post.feedLinks'>
<b:include data='post.feedLinks' name='feedLinksBody'/>
</b:if>
</b:if>
</b:loop>
xxxxxxxxxxxxxxxxxx
</div>

Add below code at line xxxxxxxxxxxx in above :

<a href='http://YOURBLOGNAME.blogspot.com/feeds/comments/TYPE'>Subscribe to: Post Comments (Atom)</a>

Change TYPE to summary or full and put actual blogname instead of YOURBLOGNAME. Save Template and you will see the link on individual post pages at the bottom.

CHANGE SUBSCRIBE TO POSTS (ATOM)

To change the line Subscribe to Posts (Atom) locate this code in the Blog Posts widget after putting a check in the Expand Widgets Template check-box :

<b:includable id='feedLinksBody' var='links'>
<div class='feed-links'>
<data:feedLinksMsg/>
<b:loop values='data:links' var='f'>
<a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/>(<data:f.feedType/>)</a>
</b:loop>
</div>
</b:includable>

CHANGE THIS TO :

<b:includable id='feedLinksBody' var='links'>
<div class='feed-links'>
<data:feedLinksMsg/>
<b:loop values='data:links' var='f'>
<a class='feed-link' expr:href='data:f.url' expr:type='data:f.mimeType' target='_blank'><data:f.name/> MY FEED LINKS</a>
</b:loop>
</div>
</b:includable>

Change MY FEED LINKS to whatever you want. Preview and save.

POSTED BY LINE BELOW POST TITLE

A blog reader wants to put the posted by line, usually found at the bottom of the post, above just under the Title of the post. To do this go to Template >> Edit Html >> First Backup Template. Then put a check in Expand Widgets Template check box and scroll down till you see this code in the post footer :

<span class='post-author'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/> <data:post.author/>
</b:if>
</span>

CUT the code and paste it in the same blog widget below this line :

Save and view blog.

IElm0D