Blogging tips and tricks

10 Best Seo Tips for Newbie Bloggers

By goldenworks on 8/20/2013

Having a beautiful and well customized blog is a vital part of every blogging task. It admires your visitors once they land to your blog pages. But this is not enough with your blogging career. You need to practice Search Engine Optimazation (SEO) in order to tell the world that you have this kind of blog and you’re happy to share it for free.

Below are some of the SEO tips that may help you to be on the right track of your blogging career.

1. Quality Content

- It is most often said that “content is king”. As a blogger we should provide our readers with fresh, quality and reliable content. Robots will be happy if you create something new to the world or if you publish something that is already known, present it in a unique and with more enhancements. Limits your words for at least 300- 500 characters.

2. Treat Post Title with H2-tag

-Next to your blog content that you are going to maximize is you post titles. By default, post titles are treated with an H-3 tag. You should change that H-3 tag to H-2 tag in order to increase your pagerank. To know more about treating post titles with H-2 tag, click here.

3. Adding alt tag to your Uploaded Images

-We should also maximize our contents through putting images on it and in that images you will add an alt tag to tell robots that they are related with your contents. Click here for assistance.

4. Practice Blog Commenting

-To a newbie blogger, it is quiet hard to let others to drop comments on your posts but I will tell you that if you just take time to comment (a good one) on other blogs, those professional bloggers will also comment back on your posts. But the essence of commenting doesn’t evolve only with the two of you, others also will follow because you already started the ball rolling.

In blog commenting, you establish linkages with other people and most importantly the back links which are also a great source of traffic.

5. Add Sharing Widget to your Blog

-Sharing widgets will help you spread your content throughout the web. Put this in every corner of your blog plus the email subscription box. I know the effect is slow but time will come that you will see its dramatic result.

6. Publish your Post at Regular Time Intervals

-As an experienced, I tend to publish my post at exactly 10:51 (Philippine Standard Time) with an intensity of one post per day. You can schedule your post publishing as long as it follows a certain pattern. You may publish one post per day at a specific time or two if you can but don’t publish too much, a maximum of three posts per day only. If ever you publish more than one post, say two post for example, wait for seven minutes to publish the second post.

7. Permalink Editing

-If posts titles are important, so with your permalink. Permalink is the link of your posts. Edit your permalink with at least six (6) most targeted keywords. Click here to know more on permalink editing.

8. Guest Posting

-In the first stage of our blogging career, guest posting is essential so that we will be exposed to the world of blogosphere an at the same time they will follow you. Try to win the heart and confidence in presenting your guest posts to them.

9. Putting Author's Image at the Search Engine Result Page

-In statistics people will tend to click those post in SERP if they see an image right before the topic that they are searching. You can click here for the tutorial.

10. Link your Blog with other Sites related to your Blog Niche!

-Connect your Blog for at least four professional sites related to your blog. I believe this could also help.

Note: All the above SEO tips were being practiced by the author itself. No the same SEO will work in all blogs.

How to Hide or Show CSS Effect in a Specific Page of your Blog

By goldenworks on 8/14/2013

In my previous tutorial, I shared to you on how to hide or show widgets in a specific page of your blog and it is quiet helpful especially if we try to focus our readers in our content only. But do you know that we can also show or hide CSS effect in particular page of our blog and some of our blog pages ? Sounds interesting! Please follow the steps below.

Hiding or Showing CSS Effect in a Specific Page of your Blog

Step 1. Select one of the CSS Effect that you made in your page. You can found this above the
]]></b:skin tag of your template.

For example in my case I want to show only the effect of the following CSS in specific page in my blog.

.sidebar .widget {
border:2px dashed #FF0000;
padding:0;
-webkit-transition: all 0.2s ease;
-moz-transition: all 0.2s;
-ms-transition: all 0.2s;
-o-transition: all 0.2s;
background-color:none;
}
.sidebar .widget:hover {
border:2px ridge #DF0101;
padding:0;
}

Step 2. Now in order to show the above CSS in my choosen page, I used the Blogger conditional tag below

<b:if cond='data:blog.url == "URL of the page"'>

Step 3. Then I put a <style> tag at the upper and lower part of the CSS like the one below:

<b:if cond='data:blog.url == "http://codes2tipsandtricks.blogspot.com/2013/08/how-to-animate-moz-normal-border-in.html"'>
<style>
.sidebar .widget {
border:2px dashed #FF0000;
padding:0;
-webkit-transition: all 0.2s ease;
-moz-transition: all 0.2s;
-ms-transition: all 0.2s;
-o-transition: all 0.2s;
background-color:none;
}
.sidebar .widget:hover {
border:2px ridge #DF0101;
padding:0;
}
</style>
</b:if>

Step 4. Now, after I made that set of codes above, I placed it below the ']]></b:skin' tag.

Just follow the steps which I illustrated above in order to show a CSS effect in your particular page.

Hiding CSS in Other Pages of your Blog

1. Show CSS only in home page,

<b:if cond='data:blog.url == data:blog.homepageUrl'>

2. Show CSS only in post pages

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

3. Show the CSS in a specific page as illustrated above

<b:if cond='data:blog.url == "URL of the page"'>

4. Hide CSS on a particular page

<b:if cond='data:blog.url != "URL of the page"'>

5. Show only CSS in a static pages

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

6. To hide CSS in a static page

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

7. Show CSS only in Archive pages

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

8. Hide CSS only in Archive pages

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

9. Hide CSS in post pages

<b:if cond='data:blog.pageType != "item"

Hope you find this tutorial a helpful one!
Check also

Peace out to all bloggers around the world!

How to Display Google Search Results in a Separate Page in Blogger

By goldenworks on 8/13/2013

How users' friendly is your blog who has a navigation tab, a search box and a sitemap. But if we add another page on it that would display the search results of the queries of your visitors is an outstanding one. You can also optimize your adsense revenue out of this technique but nonetheless it is not just making money. The main reason why you must do this is that you will help Google in indexing your posts more fast than before.
Note: This tweak will not take effect if you are using search box via Blogger's Lay-out.

Step 1. Create a Search Result Page

1.1 Go to Blogger Dashboard
1.2 Click Pages >> New Page >> Blank Page
1.3 Put a title 'Search Results'.

Note: Don't put any content on it, just leave it blank.

1.4 Publish it (without any content) and view the it.
1.5 Copy the URL of the page and keep it (we will use it at the proceeding steps below). You can find it at the browser address bar. See the screenshot below.

Step 2. Creating Your Google Customs Search Results Code

2.1 Go to Google Custom Search Engine
2.2 In the Set-up menu, click the Look and Feel

2.3 In the Look and Feel area choose Two Page

2.4 Click Save and Get Code
2.5 Now don't be confuse in this particular stage.
At first you will be instructed to get the code for search results. See the screenshot below

Next, click again the blue button and you will be instructed to get code for search box. See the screen shot below.

Please keep the two sets of code in a safe place (we will use this in the next steps).
2.6 Now click the button at the top right corner, this is the Search Results Details. In the first empty box (top), put the URL of your Search Result Page (in step 1.5 above) and in the second box (buttom), put your blog initial name like BTT in my case. See the screenshot below for guidance.

2.7 After you filled the necessary informations you may now click Save button.

Step 3. Creating the Search Box and Adding the Search Result Page

3.1 Go to Blogger Dashboard >> Lay-out >> Add Gadget

3.2 Scroll down and select HTML/Javascript
3.3 Paste inside the empty box the code for your search box ( do this as you usually did in putting html/javascript code). Then position it at the most prominent place ( at the top-right corner of your blog). Then Save Gadget.
3.4 Now paste the code of your search results to your page you have created in step 1. It must be in HTML mode.
3.5 Hit update and you're done! That's all!
Hope you like this little tutorial and I'm glad to hear your feedbacks friends!

Happy Blogging Day :=)

How to Add Adsense Code Below Every Post Titles

By goldenworks on 8/12/2013

Placing Adsense ads in once blog/site is a vital part to maximize your ad performance with adsense. One of the best places to put your adsense code without annoying your readers is below your post titles.Why below post titles? Because it is the position with the highest click-through rate (CTR). Please see the Google Adsense Heat Map below for more informations.

Step 1. Preparing for Adsense ad Code

1.1 Go to Blogger Dashboard >> Earnings >> View Dashboard
1.2 Create new ad unit. Use the best performing ad units (300 x 250 medium rectangle or 336 x 280 large rectangle) to have a better results. Don't forget to put it with another name for monitoring purposes.
1.3 Get the code.
1.4 Now parse the adsense code using this parser tool because it will not work if it is unparsed.

Step 2. Adding the Parsed Adsense Code to the Template

2.1 Go to Blogger Dashboard >> Template (Back - up your template for reference)
2.2 Click Edit HTML button
2.3 Find or Control F the code below (select the third occurrence of the code)

<data:post.body/>

2.4 Place the parsed code just above that code "<data:post.body/>". Choose the third occurrence of the code.
2.5 Save your Template and you are done!

Check also:

If you have some questions, suggestions or additional informations feel free to leave it at the comment box below. I will try my best to answer it as time allows.
Peace out my friend and Enjoy!

How to Add 123 Contact Form for FREE in Blogger

By goldenworks on 8/11/2013

Having a contact form is a vital part of every blog/website. It enables your readers to have an indirect link with you regarding your products or services. In such manner this gives all visitors a path in which to open a good communication with you and to your clients. There are many types of contact forms that can be used in variuos occasions like survey questions, polling visitors on various topics, or allowing visitors to join your newsletter. In this tutorial, I will show you on how to add contact form via 123contact form since I used this also in my contact page.

How to Add 123 Contact Form in Blogger

Step 1. Go to 123 contact form.
Step 2. Create an account there for free.
Step 3. Then follow all the steps that the requested from you.
Step 4. Get or copy the codes for your contact form. The codes may look like this:

<script type="text/javascript">var servicedomain="www.123contactform.com"; var frmRef=window.top.location.href; var cfJsHost = (("https:" == document.location.protocol) Some Codes Here.................................................; </script>
Report it!">Report abuse


Step 5. Go to your Blogger Dashboard >> Click New Post or you may use New Page (static page).
Step 6. In your Blogger Post Editor's Page, paste the code that you have got from 123contact form (in step 5). You may put a title (Contact Us or Contact).

Note: In putting the contact form codes, your Blogger Post Editor's Page must be in HTML mode.

Step 7. Publish it in an earlier period of time so that it will not appear at your home page but if you're using a new page, just simply hide it.

Bonus Tip

If you want to appear your contact page like mine in a manner that it occupies the whole page of your blog. Please follow the steps below:
1. Go to Blogger Dashboard >> Click Template (have a backup of it as your reference)
2. Hit the Edit HTML buttom
3. Locate or Control F the tag below

]]></b:skin>

4. Just below the code "]]></b:skin>", you paste the code below

<b:if cond='data:blog.url == "
http://bloggingtipsandtrix.blogspot.com/2012/12/about-me.html"'><style>
.main-inner .columns {
padding-left: 0px !important;
padding-right: 0px !important;
}
.main-inner .fauxcolumn-center-outer {
left: 0px !important;
right: 0px !important;
}
.main-inner .fauxcolumn-left-outer, .main-inner .fauxcolumn-right-outer, .main-inner .column-left-outer, .main-inner .column-right-outer {
display: none !important;
}
</style>
</b:if>

Customization:

Replace the URL (red bold text) with the URL of your Contact page.

5. Since we make your post (contact page) occupies the entire portion of your page, there is already a little problem on its margin, that is your contact form lies at the left side of your page and in order to solve this one, please paste the code below and paste it just above the codes that you have got from 123contact form as shown in the screen shot below:

<center><style>#sidebar-wrapper, #midsidebar-wrapper, .gapad2, .blog-pager, .post-header-line-1, .post-footer { display:none !important;} #main-wrapper { width:900px!important;} .post { width:900px!important; }
</style></center>

6. Save your template and you are done!

If you some questions regarding this post,feel free to leave it at the comment box below or please contact me. I will try to answer it as time allows.
Thank you and have peace in your heart and mind! Enjoy!!!

How to Add Author's Profile Picture in Google Search Results Page

By goldenworks on 8/08/2013

I know that every blogger dreams to increase their page rank dramatically in a duration of time. So I was researching on those SEO tips that might help this goal and I found that one of those ways is having an author's profile picture that shows in the Search Engine Result Page. According to research that most people will click those related searches in the SERP having this kind of technique. And for this reason, I'm gonna show you on how to make this one in the most easy way.

How to Add Author Profile Picture in Google Search Results Page

Step 1. Comply the pre-requisite requirements below:
1. Of course, you must own a certain website.
2. A Goggle Plus account.
3. Create an About Me or About Us page much better if it contains your profile picture, a 128px by 128px size JPEG format will do.
If you meet all those pre-requisite requirements above, you may now proceed to the next steps.
Step 2. Add the link below anywhere in your site (either in header, footer or sidebar).

<a href="https://plus.google.com/GOOGLE+ ID"
rel="author" target="_blank"> Join me on Google+</a>

Customization:

Replace the GOOGLE+ID with your own G+ ID. You can get this one at the browser address bar of your G+ account. Please take a look at the screenshot below.

You can replace the texts in green Join me on Google+ (optional).

Step 3. In your About me page add the link below at the beginning of your About me page (see my About me as an example).

<a href="https://plus.google.com/110772451841046895789" rel="me" title="Cerwenlloyd gefjun">Cerwenlloyd Gefjun</a>

The series of 21 numbers in orange bold is my Google + ID, replace it with your own.
The name in blue color is my G+ Profile name, replace it also with your own G + profile name.
Replace Cerwenlloyd Gefjun with your name ( much better if it is the same with your G + profile name).

Step 4. Next is you are going to add your About me page anywhere in your blog using the link below. In my case, I add it at the footer my blog.

<a rel="author" href="http://bloggingtipsandtrix.blogspot.com/2012/12/about-me.html">About</a>

Customization:

Change the URL (http://bloggingtipsandtrix.blogspot.com/2012/12/about-me.html) with the URL of your About page.
Replace the text About with your own word ( like About me or About us)

Step 5. Go to your G+ Profile account scroll down and click the link button. See the screenshot below.

Step 6. Add the URL of your Home page, Contact, and About. You may also put the URL of your Facebook fan page and Twitter link.

Step 7. Upload your profile picture on Google+ (this photo is the same with what you had uploaded in your About page). Your photo must be a 128 px by 128px or 150px by 150px in size. (See the screenshot below for help).

Note: Don't upload a rectangular image.
Step 8. Save your uploaded profile picture and you're done!

Test Now How Your Uploaded Picture Appear On Google Search Results Page

1. Go to Rich Snippets Tool
2. Submit your homepage URL at the search box and then hit the Preview button.

Note: If you followed the above tutorial correctly a note will appear like in the screenshot below.

After few days or weeks, test if your profile picture is appearing in the Search Engine Results Page. But if you miss one of the steps above, an error will occur. You may review or repeat it once!
God Bless Everybody!!!

Subscribe to: Posts ( Atom )