Install A Paypal Donation Button On A Blog Or Website

In this page I will share tips about how to install a Paypal donation button on a blog or website, who knows that there is a friend who also want to install a Paypal donation button on his blog.

Before we can install a Paypal donation button on a blog or website, of course, we must register into Paypal first, to register into paypal click here.If you already have an account, you can directly follow the steps below:

1. Login to your Paypal account, select the Merchant Services
2. On the Key Features, select Donations (see the right section)
3. On the Accept Payments For menu , select Donations
4. Organization name / service, Write the name of your organization or your name.
5. Donation ID (optional), write the donation id eg:id for the site A, site B (if you install some of the donation button).
6. On the Customize Button menu, select Customize Appearance to set the display of Paypal donation button .
Paypal button (setup according to your needs)
Use your own button image (if you want the button image with your own creations)
7. Currency, leave the default USD
8. Contribution amount, Donors enter their own contribution amount (donor is free to specify the number of donation).
Donors contribute a fixed amount (donor will give a donation to the amount you specify).
9. Press the Create Button to create a donation button HTML code.
10. Then highlight the HTML code and Copy-paste the HTML code to your site or blog.

That's it, a Paypal donation button was created.

Create Read More 0n The Blog Post 0n New Blogger

May be there are some people don't know how to create read more on the blog post on new Blogger.On this page, I will share tips about how to create read more on the blog post on new Blogger.There are two methods to do as listed below:
- The first method:
1. Log in to Blogger with your account .
2. On the dashboard menu select template tab.
3. On the template menu select edit HTML.
4. On the edit HTML tick the check box for Expand Widget Templates.
5. Then scroll-down and search for the </head> tags, then copy-paste the code below before that </head> tags :

<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>

6. Then scroll down again and search for the <data:post.body/> tags like this:

<div class='post-header-line-1'/>
<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <! - clear for photos floats ->
</ div>

7. After that,copy-paste the code below after the <data:post.body/> tags:

<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'> Read More..</a>
</b:if>

8. Click Save.
9. And each time you make a post make sure in the edit HTML mode not in compose mode,then you add the code <span class="fullpost"> and </span> between the rest of post that you want to marked as read more like this:

<span class="fullpost">
the rest of post
</span>

- The second method
1. Repeat the steps 1-4 on the first method above.
2. On the edit HTML scroll down and directly search for the <data:post.body/> tags like this:

<div class='post-header-line-1'/>
<div class='post-body entry-content'>
<data:post.body/>
<div style='clear: both;'/> <! - clear for photos floats ->
</ div>

3. If you find it, then replace the <data:post.body/> tags with the code below:

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>

<p><data:post.body/></p>

<a expr:href='data:post.url'>Read More...</a>
</b:if>

4. Save the results.
5. On the dashboard menu select Settings tab then on the Settings menu select the Formatting tab.
6. On the box Post Template fill the following code:

<span class="fullpost">

</span>

And save.
7.Each time you make a post make sure in the edit HTML mode not compose mode, the above code automatically appears in the edit HTML mode,so you can placing the code <span class="fullpost"> and </span> between the rest of post that you want to marked as read more like this:

<span class="fullpost">
the rest of post
</span>

Create A 2 Column Template Become A 3 Column Template

If you were interested to replace new template or want to redesign your template, It is best to backup your template before you changing any code.This step was as prevented to reduce the fatal risk if the mistake happening in redesign or changing your template. For you that did not yet know how to backup your template, please followed steps below :


1. Log in to Blogger with your account.


2. After entering the dashboard page , click template.


3. Then click edit HTML tab.


4. Click the Download full template link.


5. After you click Download full template link, then will emerge new window just to download. Click the Save button.


6. You could choose this data would in kept where and with what file name what, Afterwards ended with click of the Save button.

7. Finish.


Now you had back up the template, if next time you needed it, you could use this came back.Now I will explain how to create a 2 column template become 3 column template,the steps are as follows:

1.Scrolldown HTML editor on blogger so you find the code as follows:

@media all {
div#main {
float:$startSide;
width:66%;
padding-top:30px;
padding-$endSide:0;
padding-bottom:10px;
padding-$startSide:1em;
border-$startSide:dotted 1px $bordercolor;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

2.Change the widht from 66% widht to 40% widht because we will make a second sidebar 26% widht and the second sidebar code like this:

div#sidebar2 {
margin-top:20px;
margin-$endSide:0px;
margin-bottom:0px;
margin-$startSide:0;
padding:0px;
text-align:$startSide;
float: $endSide;
width: 26%;
word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
}

3.Scroll down after the <body> tag we will find the code like this:

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section> </div>

4.Then cut and paste the code above after the code first sidebar:

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
</b:section>
</div>

5.Then cut and paste the code as a second sidebar below after the new location of main wrapper code,the second sidebar code will be like this:

<div id='sidebar-wrapper'>
<b:section class='sidebar2' id='sidebar2' preferred='yes'>
</b:section>
</div>

6.If we combined the code after the <body> tag above will be like this:

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
</b:section>
</div>
<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Blog Posts' type='Blog'/>
</b:section> </div>
<div id='sidebar-wrapper'>
<b:section class='sidebar2' id='sidebar2' preferred='yes'>
</b:section>
</div>

7.Then save the template and we already have a 3 column template.