Friday, August 21, 2020

How to Make Visible Search Description in Blogger Blog Post

How to Make Visible Search Description in Blogger Blog Post If you say what is the best part for SEO then I must say about Search Description. Because this is a very significant part of a Blogs SEO. Most of users add search description about Blog which will display in search engine result page. But many of us ignore adding search description in Blog post. Though Search Description always remain hidden inside Blog post but we must write good Search Description from divert organic traffic from search engine. Whatever you write as a Search Description it wont be visible. But this Search Description will be visible in search engine result page. You might see when you make any search query then many links with small description is showing up on search engine result page. That small description is Search Description. When you add a better and unique search description then search users from search result page instantly decide whether to visit this site or not? So always try to write a better Search Description for each post. I did many relevant talked about Search Description but the main purpose of this tutorial to make Search Description visible inside Blog post. Thus after entering into your Blog post page readers get a short idea by reading Search Descriptions. This will work like 2 in 1. Your post will get better visibility on search engine result page on the other hand readers on your Blog post page will get a clear idea of what your Blog post is all about. To make it visible I will use a Meta tag which will make it visible below post Blog Post title inside the post. But dont worry this summary wont be visible on your Blogger home page as post snippets. However before proceed you can see my Blog Post that I have applied this trick to make my search description visible below Post tile above first image. Step 1Log in to your Blogger Account and Go to yourBlogger Dashboard Step 2Click on-Template-Edit HTML- Step 3Now Find]]/b:skinBy Pressing Ctrl+F (Windows) or CMD+F (Mac) Step 4Copy the below code and Paste it above/before ]]/b:skin /*Search Description by http://www.bloggerspice.com*/ . BSDesc{background-color:#ECECEC;overflow:hidden;padding:10px;font-size:15px;margin-bottom:15px} . BSDesc p{margin:0;opacity:0.8} Alternative Design Box Style /*Search Description by http://www.bloggerspice.com*/ .BSDesc{background-color:#F6F7F9;border:1px solid #E3EAF0;overflow:hidden;padding:10px;font-size:15px;margin-bottom:15px} .BSDesc p{margin:0;opacity:0.8} Customization Please alter #ECECEC to change the search description box background color. Alter font-size:15px; for changing font size of the widget. Step 5Now again locate data:post.body/ you will find 3 or 4 times this code but use the code for second one. Step 6Copy the below code and Paste it above/before data:post.body/ div class=BSDesc'p itemprop='description'data:blog.metaDescription//p The final code will be like below div class='BSDesc'p itemprop='description'data:blog.metaDescription//pdata:post.body/ Step 7Finally click Save template button and exit from there. In this post I have apply a simple trick. Generally we use a Blog Meta description to give more information to search engine about search description. The Meta description code is like below. meta expr:content='data:blog.metaDescription' itemprop='description'/ I just used data:blog.metaDescription code and added simple design by wrapping up by using CSS code. However you can spice up this search description area by modifying the CSS code such as color, background, Font style, size etc. You are done... to see it live check your Blog post and see search description is visible. And your Blog readers easily can get clear idea by reading search description before go through the whole article. Happy Blogging!!!

No comments:

Post a Comment

Note: Only a member of this blog may post a comment.