How To Add a Subtitle For Your Blog Title In Blogger

2 min read

Hello, Bloggers! Welcome to Raghavendra Technic.



In this tutorial, we are going to show you How To Add a Subtitle For Your Blog Title In Blogger





You might have been already see in the latest iMgaz and Fletro pro templates there is a small subtitle which appears just beside the Blog Title but this subtitle is not available in other template like Median UI etc.. But have you ever wonder How to add this Subtitle in any other blogger templates? To know it read full article and follow al steps carefully.
You can add this any Blogger template but the main thing is to paste the codes in the correct place.



You can add this any Blogger template but the main thing is to paste the codes in the correct place.



How to add Subtitle



Important!Before we start adding codes in XML, I will recommend you to take a Backup of your current theme. By chance if any problem occurs, you can restore it later.



Step 1: First of all Login to your Blogger Dashboard.



Step 2: On Blogger Dashboard, click Theme.



Step 3: Click the arrow down icon next to 'customize' button.



Step 4: Click Edit HTML, you will be redirected to editing page.



Step 5: Now search the code ]]></b:skin> and paste the following CSS Codes just above to it.



Make sure that .Header CSS class name matches with your theme header class name



/* Header Subtitle */ .headerSub{margin-left:5px;font-family:var(--font-body);font-weight:400;font-size:11px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;max-width:50px;vertical-align:middle;opacity:.6;flex-shrink:0}.Header .headerSub:before{content: attr(data-text)}


Step 6: Now click on 'Jump to Widget' widget and Choose Header section as shown in below image



how-to-add-a-subtitle-for-your-blog-title-in-blogger-


Step 7: Now find <data:title/> in your Header section



Step 8: Now paste the following code just beside the <data:title/> as shown in below image




<!--[ Header Description ]-->
<b:tag class='headSub' cond='data:this.description' expr:data-text='data:this.description' name='span'/></b:tag>




Step 9: That's it! Now click on save theme by clicking this icon



Step 10: That's done!



How to add different Subtitles in Blog posts and pages?



Copy the below CSS Codes and add it in your Post by switching to HTML View


<style>
.Header .headerSub{max-width:none}
.Header .headerSub:before{content:"About"}
</style>





Credit

Created by : Techy darshaN.


Conclusion


In this article I have made a tutorial on How To Add a Subtitle For Your Blog Title In Blogger. I hope you have liked it and Please do share with your friends and follow our blog for more



If you face any problems in code or have any questions please feel free to ask in comments section or join our Telegram Group for discussion.



Our All Posts Are Protected By DMCA. So Don't Try To Copy Our Posts And Reproduction In Any Way Is Strictly Prohibited! Or else Legal Actions Will Be Taken. © Raghavendra Technic | All Rights Reserved



© Copyright:
raghavendratechnic.blogspot.com

~ Learning.

You may like these posts

  • Hello, Bloggers! Welcome to Raghavendra Technic.In this tutorial, we are going to show you How To Add a Subtitle For Your Blog Title In BloggerYou might have been already see in th…
  • Hello, Bloggers! Welcome to Raghavendra Technic.In this tutorial, we are going to show you How to add Pagination in blogger Important!Before we start adding codes in XML, I will r…
  • Hello, Bloggers! Welcome to Raghavendra Technic.Are you observing the Word Counter Script on blogger. This is the Right Place to you. Since You can get this Script for free.Today, …
  • Hello, Bloggers! Welcome to Raghavendra Technic.In this tutorial, we are going to show you How To Remove Date From Blogger Post URLAre you searching for how to change permalink in …
  • Hello, Bloggers! Welcome to Raghavendra Technic.In this tutorial, we are going to show you How to Add Syntax Highlighter in BloggerMost of you somehow will have noticed on many of …
  • Hello, Bloggers! Welcome to Raghavendra Technic.You might seen emoticons in telegram or whatsapp or other social platforms but you have the question about how you can add that emot…

Post a Comment

Bookmark