This post will help you add a RESPONSIVE Breaking News widget with the Latest Posts in Blogger with our Ready-made Code. It Displays Latest Posts with the Link of those posts.
You can use our Ready-made CODE to Add RESPONSIVE Breaking News Widget in Blogger in a few minutes.
You can choose the Number of Latest Post Titles to Display and the Time after which the Posts Titles are changed. This widget is Completely Responsive.
Below is the DEMO of the RESPONSIVE Breaking News Widget:
Now Let’s learn to Add RESPONSIVE BREAKING NEWS WIDGET to Blogger Site:
#1. First of All, Download the Ready-made Code Notepad file to Add the RESPONSIVE BREAKING NEWS Widget in Blogger.Click Here to DOWNLOAD the CODE Notepad File to add Responsive Breaking News with Latest Posts Widget in Blogger.
#2. Now OPEN the CODE Notepad File to CUSTOMIZE it. There are 3 Parts of Code in the downloaded code notepad file.
You can CUSTOMIZE the Background Color, Font Size, Font Color, Font Family, etc., from the 2nd Part of CODE.
VVI NOTE: You Need to CUSTOMIZE your Site Link in the 1st Part of CODE. Don’t forget to Add your Site Link in the CODE. Also, you can CUSTOMIZE the transition time after which the Next Post Titles will be shown from the 1st part of Code as shown in the photo below.
Also, You can change the ICON displayed in the Widget from THIS WEBSITE. Paste the Script for ICON from THIS Site and Paste it in our 3rd Part of Code as shown in the photo below.
#3. Open Blogger, go to Theme Option, and then EDIT HTML to PASTE the Code to Add RESPONSIVE Breaking News Widget in Blogger HTML.
COPY the 1st part of CODE, SEARCH for </body> in Blogger HTML and then Paste the 1st part Code JUST ABOVE or BEFORE: </body>
VVI NOTE: You Need to CUSTOMIZE Your Site Link in the 1st Part of CODE. Don’t forget to Add your Site Link in the CODE.
#A. For 1st PART of the CODE:
The 1st Part of CODE should be Added in Blogger HTML JUST ABOVE or BEFORE </body> tag. COPY the 1st part of CODE, SEARCH for </body> in Blogger HTML and then Paste the 1st part Code JUST ABOVE or BEFORE: </body>
VVI NOTE: You Need to CUSTOMIZE Your Site Link in the 1st Part of CODE. Don’t forget to Add your Site Link in the CODE.
Also, you can CUSTOMIZE the transition time after which the successive Post Titles will be shown from the 1st part of Code as shown in the photo below.
The 2nd Part of CODE should be added in Blogger HTML JUST ABOVE or BEFORE:
You can CUSTOMIZE the Background Color, Font Size, Font Color, Font Family, etc., from the 2nd Part of CODE.
#B. For 2nd Part of CODE:
]]></b:skin>
You can CUSTOMIZE the Background Color, Font Size, Font Color, Font Family, etc., from the 2nd Part of CODE.
#C. For 3rd Part of Code:
This Part of the Code should be Added in Blogger LAYOUT where you want to show the Breaking News Widget.
Go to the LAYOUT Option, Click on ‘Add NEW Gadget’ and then Select HTML/JavaScript Widget.
Paste there our 3rd Part of CODE.
Also, You can change the ICON displayed in the Widget from THIS WEBSITE. Paste the Script for ICON from THIS Site and Paste it in our 3rd Part of Code as shown in the photo below.
Now, check your site for Responsive Breaking News Widget.
Congratulations, you just Learnt to RESPONSIVE BREAKING NEWS WIDGET in your Blogger Posts with our Ready-made Script.