On this occasion, we will try to learn to create/add label/category descriptions and thank you notes at the bottom of each post or above the share button. For people who like to tamper with the appearance of the blog, trying something new is okay to do as long as it doesn't have a bad impact on the development of the blog.
In addition to changing the appearance, adding widgets, adjusting fonts, changing background colors, etc., we also often add text or certain information to make the blog look more attractive and easy to navigate.
Maybe you've seen a display like this on some well-known blogs such as the CB blog, TrickPk blog, and other blogs.
How to Add Labels and Acknowledgments Under Each Blog Post
Please note, I actually took this tutorial from the code in my blog template which I slightly modified using the svg icon and changing the sentence. After I tried to apply it to my other blogs with different templates, the results turned out to be even cooler and more interesting.
In addition to the description of the label as a complement to navigation, the expression of gratitude is also a kind of appreciation from us blog owners to visitors who have taken the time to read the articles on our blog.
Well, for those of you who want to try installing it on your blog, please follow the steps below to implement it.
Open your Blogger account.
Select the Theme menu and click Edit html.
Find the code <data:post.body/> and place the following code below it.
- Number 5 is the number of posts per label on the index page view. Adjust to your blog's theme settings.
- Categories :
- Thank you for reading
- Please Share ...!
Step 4. Now Save the template again and see the result.
<div id='trickpkthanks'> <small><strong> Categories :</strong> <b:loop values='data:post.labels' var='label'> <a expr:href='data:label.url + "?max-results= 5 "' expr:title='data:label.name' rel='tag nofollow'><data:label.name/></a><b:if cond='data:label.isLast != "true"'> ,</b:if> </b:loop> </small> <p><small><svg style='margin-bottom:-2px;width:15px;height:15px' viewBox='0 0 24 24'> <path d='M23,10C23,8.89 22.1.8 21.8H14.68L15.64,3.43C15.66,3.33 15.67,3.22 15.67,3.11C15.67,2.7 15.5,2.32 15.23,2.05L14.17,1L7. 59,7.58C7.22.7.95 7,8.45 7.9V19A2,2 0 0.0 9,21H18C18.83,21 19.54,20.5 19.84,19.78L22.86,12.73C22.95,12.5 23,12.26 23,12V10M1, 21H5V9H1V21Z' fill='#3b5998'/> </svg> Thank you for reading <b><data:post.title/></b>. Please Share ...!</small></p> </div>
Information:
You can change the sentences English as in above html code like
If you want to decorate it again, you can also add CSS styles to the script above, for example to add background, font settings, borders, box shadows, etc. For example I add the following CSS code above the code ]]></b:skin> or </style>
#trickpkthanks{padding:5px;background:#e4c0a8;font-size:15px;box-shadow:3px 3px 8px #777}
Then the result will be like this:
So it's cooler isn't it. That was the tutorial on how to add a label and a thank you note under each Blog post. May be useful.