How To Add A Custom Content Banner Widget To Your Blogger Website?

Ever wanted to add a custom banner to your blogger website to display certain places of your site or platforms you're currently subscribed to. Good news, we've got a widget to match your liking as seen above.

Step 1: Go to Blogger's layout section and click Add Gadgets 

Step 2: You will have to choose HTML/JavaScript and copy the code provided below

<div class="custom-banner">

    <div class="banner-content">

        <h3>Explore Our Content!</h3>

        <p>Check out our latest posts and resources.</p>

        <div class="banner-buttons">

<a href="https://prsdube16.blogspot.com/p/posts-you-might-like.html?m=1" class="banner-btn">Cartoon Games</a>

            <a href="https://prsdube16.blogspot.com/p/featured-attractions.html?m=1" class="banner-btn">DStv Highlights</a>

            <a href="https://prsdube16.blogspot.com/search/label/Everyday%20Novelas?m=1" class="banner-btn">Telenovela Updates</a>

<a href="https://www.mediafire.com/folder/7vznku6zvg906/Insidus+Collection" class="banner-btn">Insidus Plus - Documents And Games</a>

<a href="https://prsdube16.blogspot.com/search/label/Openview%20Plus?m=1" class="banner-btn">Openview Highlights</a>

<a href="https://prsdube16.blogspot.com/p/posts-you-might-like.html?m=1" class="banner-btn">News On Animation</a>

<a href="https://prsdube16.blogspot.com/search/label/Sports%20Entertainment?m=1" class="banner-btn">Sports Highlights</a>

<a href="https://taplink.cc/prsdube16" class="banner-btn">Social Platforms</a>

<a href="https://prsdube16.blogspot.com/search/label/Video%20Entertainment?m=1" class="banner-btn">Streaming Highlights</a>

        </div>

    </div>

</div>

<style>

.custom-banner {

    background-color: #FFFFFF;

    border: 0px solid #ddd;

    border-radius: 8px;

    padding: 20px;

    text-align: center;

    margin: 10px auto;

    max-width: 1200px; /* Adjust width as needed */

}

.banner-content h3 {

    font-size: 24px;

    margin: 0 0 10px;

    color: #333;

}

.banner-content p {

    font-size: 16px;

    color: #666;

    margin: 0 0 15px;

}

.banner-buttons {

    display: flex;

    justify-content: center;

    gap: 10px;

    flex-wrap: wrap;

}

.banner-btn {

    background-color: #ff0000;

    color: #ffff00 !important;

    padding: 10px 20px;

    text-decoration: none;

    border-radius: 5px;

    font-size: 10px;

    transition: background-color 0.3s;

    white-space: nowrap;

}

.banner-btn:hover {

    background-color: #0056b3;

    color: #ffff00

}

@media (max-width: 600px) {

    .custom-banner {

        max-width: 90%;

        padding: 10px;

    }

    .banner-buttons {

        flex-direction: column;

    }

    .banner-btn {

        width: 88%;

        margin-bottom: 10px;

    }

}

</style>

Notes

• By <a></a> you can remove the links within href and replace them with your own

• Before closing with </a> you can give your link a name

How To Add A Recent Posts Slider To Your Blogger Website?

You may have visited a couple of websites and noticed that their posts move automatically in a vertical position and wondered how you can get this on your blogger website. Below is some types on how you can get this widget on your blogger website.

Step 1: Go to Blogger's layout section and click Add Gadgets 

Step 2: You will have to choose HTML/JavaScript and copy the code provided below

Below this recent post slider shows posts based on particular label 

<div id="recent-posts-slider">

  <ul id="recent-posts-list"></ul>

</div>

<style>

#recent-posts-slider {

  overflow: hidden;

  width: auto; /* Ensure full width */

  background: #f9f9f9;

  border: 0px solid #ddd;

  padding: 10px;

}

#recent-posts-list {

  display: flex;

  gap: 15px;

  animation: slide-left linear infinite;

  list-style: none;

  padding: 0;

  margin: 0;

}

#recent-posts-list li {

  min-width: 220px;

  max-width: 220px;

  background: transparent;

  border: 0px solid #ccc;

  padding: 5px;

  box-shadow: 2px 2px 5px rgba(0,0,0,0.1);

  text-align: center;

}

#recent-posts-list img {

  max-width: 100%;

  height: auto;

  margin-bottom: 8px;

}

#recent-posts-list a {

  text-decoration: none;

  color: #ff6a00;

  font-weight: bold;

}

/* Media Queries for responsiveness */

@media (max-width: 768px) {

  #recent-posts-list li {

    min-width: 150px; /* Reduce the min-width on mobile */

    max-width: 150px;

  }

}

@media (max-width: 480px) {

  #recent-posts-list li {

    min-width: 120px; /* Further reduce for smaller screens */

    max-width: 120px;

  }

}

@keyframes slide-left {

  0% { transform: translateX(0); }

  100% { transform: translateX(-100%); }

}

</style>

<script>

  const feedUrl = "https://prsdube16.blogspot.com/feeds/posts/default/-/Upcoming?alt=json"; // Change 'Tech' to your label

  const list = document.getElementById("recent-posts-list");

  fetch(feedUrl)

    .then(res => res.json())

    .then(data => {

      const posts = data.feed.entry || [];

      posts.slice(0, 10).forEach(post => {

        const title = post.title.$t;

        const link = post.link.find(l => l.rel === "alternate").href;

        let thumb = "https://via.placeholder.com/220x150?text=No+Image";

        if (post.media$thumbnail) {

          thumb = post.media$thumbnail.url;

        } else if (post.content && post.content.$t.match(/<img[^>]+src="([^">]+)/)) {

          thumb = post.content.$t.match(/<img[^>]+src="([^">]+)/)[1];

        }

        const li = document.createElement("li");

        li.innerHTML = `

          <a href="${link}" target="_blank">

            <img src="${thumb}" alt="${title}" />

            <div>${title}</div>

          </a>

        `;

        list.appendChild(li);

      });

      const speed = 40;

      list.style.animationDuration = `${speed}s`;

    })

    .catch(err => {

      console.error("Failed to load recent posts:", err);

      list.innerHTML = "<li>Failed to load posts.</li>";

    });

</script>

This recent posts slider shows all posts by default

<div id="recent-posts-slider">

  <ul id="recent-posts-list"></ul>

</div>

<style>

#recent-posts-slider {

  overflow: hidden;

  width: auto; /* Ensure full width */

  background: #f9f9f9;

  border: 0px solid #ddd;

  padding: 10px;

}

#recent-posts-list {

  display: flex;

  gap: 15px;

  animation: slide-left linear infinite;

  list-style: none;

  padding: 0;

  margin: 0;

}

#recent-posts-list li {

  min-width: 220px;

  max-width: 220px;

  background: transparent;

  border: 0px solid #ccc;

  padding: 5px;

  box-shadow: 2px 2px 5px rgba(0,0,0,0.1);

  text-align: center;

}

#recent-posts-list img {

  max-width: 100%;

  height: auto;

  margin-bottom: 8px;

}

#recent-posts-list a {

  text-decoration: none;

  color: #ff6a00;

  font-weight: bold;

}

/* Media Queries for responsiveness */

@media (max-width: 768px) {

  #recent-posts-list li {

    min-width: 150px; /* Reduce the min-width on mobile */

    max-width: 150px;

  }

}

@media (max-width: 480px) {

  #recent-posts-list li {

    min-width: 120px; /* Further reduce for smaller screens */

    max-width: 120px;

  }

}

@keyframes slide-left {

  0% { transform: translateX(0); }

  100% { transform: translateX(-100%); }

}

</style>

<script>

  const feedUrl = "https://prsdube16.blogspot.com/feeds/posts/default?alt=json"; 

  const list = document.getElementById("recent-posts-list");

  fetch(feedUrl)

    .then(res => res.json())

    .then(data => {

      const posts = data.feed.entry || [];

      posts.slice(0, 10).forEach(post => {

        const title = post.title.$t;

        const link = post.link.find(l => l.rel === "alternate").href;

        let thumb = "https://via.placeholder.com/220x150?text=No+Image";

        if (post.media$thumbnail) {

          thumb = post.media$thumbnail.url;

        } else if (post.content && post.content.$t.match(/<img[^>]+src="([^">]+)/)) {

          thumb = post.content.$t.match(/<img[^>]+src="([^">]+)/)[1];

        }

        const li = document.createElement("li");

        li.innerHTML = `

          <a href="${link}" target="_blank">

            <img src="${thumb}" alt="${title}" />

            <div>${title}</div>

          </a>

        `;

        list.appendChild(li);

      });

      const speed = 40;

      list.style.animationDuration = `${speed}s`;

    })

    .catch(err => {

      console.error("Failed to load recent posts:", err);

      list.innerHTML = "<li>Failed to load posts.</li>";

    });

</script>

Notes

• By const feedURL replace it with your URL and the Upcoming label replace it with any label on your website

• The const speed widget goes faster if decrease below 40

• By posts slice (0,10) this is where you decide how many posts you want to have displayed

Development Alert (Rumour): Mehndi Hai Rachne Waali, Tunte And Likely More Shows Are Set To Debut On An Upcoming Zulu Dubbed Bollywood Channel On DStv

Following the successful rollout of Zee Zonke on DStv, it looks MultiChoice is looking to expand this offering with another TV channel on the platform. This news comes just after reports that eMedia Investments is also looking to venture into this crowded space with Uzozisola - Regrets.

Not much has been disclosed about the channel but by looking at the content in question it's clear that Star India is distributing this brand to the platform. Star India already offers Star Life, Vijay TV and StarPlus brands on DStv.

There was a report I was planning to make regarding another channel on DStv some consumers probably wouldn't have noticed it, Zambezi Reloaded.

Zambezi Reloaded was a pop-up channel similar to the Switch'd On channels on DStv which served as a catch-up channel to content viewed on Zambezi Magic. What was weird about this was MultiChoice's sudden decision to remove the channel by the end of July.

Switch'd On remains operational despite Eskom winding down on power cuts so can we only assume that maybe MultiChoice's reason for removing Zambezi Reloaded has to do with this channel. Maybe MultiChoice is looking to allocate it on channel 165 but I'd imagine them wanting to allocate it next to Zee Zonke.

It could as well be that ROK moves from channel 168 to 165.

As for the content part of this brand, this yet to be launched channel features shows like Tunte, Elinye Ithuba (Mehndi Hai Rachne Waali), Uthando Lweqiniso (likely Poongatru Thirumbuma) and Isivumelwano (Tharala Tar Mag!). 

NOT SHOCKING!!! eMedia Investments Launches It's First Zulu Dubbed Bollywood Drama Uzozisola - Regrets On e.tv This August

Following the success of eMedia Investments' Kuiertyd on eExtra, the broadcaster is now looking to dub more dramas in other languages. Starting with the Bollywood drama Silsila Badalte Rishton Ka which will be titled Uzozisola - Regrets when it launched on e.tv from Monday 11 August at 20:30.

18:30 and 20:30 have been viewed as cursed timeslots for the broadcaster as the shows in question struggled to garner traction from the likes of Uzalo and Skeem Saam on SABC 1. By adding Uzozisola - Regrets, it's basically no competitor to that offering but rather to VIU and Zee Zonke.

VIU which Canal+ maintains a 36% stake and may look to acquire a controlling stake by 2026% is in the process of acquiring MultiChoice. The streamer has dubbed various telenovelas from Asia and Turkey into local languages so don't be surprised if more of those suddenly appear on DStv.

Following its inclusion on DStv in 2023, Zee Zonke has proved to be resounding success after garnering over 200,000 viewers. With e.tv having more reach, Uzozisola - Regrets viewership will most definitely double or quadruple Zee Zonke and lead to further additions.

But I think the question many should ask is how it may affect eExtra.

eExtra is home to these type of content alongside those from Asia, Turkey and various parts of Europe. With eMedia Investments dubbing Bollywood dramas, how long do you suppose it will be till eExtra only offers Zulu dubbed Bollywood series I mean that's how Kuiertyd started out.

If I'm being honest, eExtra has aired a lot of these shows in English and if eMedia Investments were to all of a sudden pull a Zee Zonke they could risk alienating viewers. My presumed guess would be that maybe they'll try to balance these shows but if I had to be honest I wouldn't be shocked if the latter became Zulu.

eExtra has been pumping the breaks on these shows every now and then while Kuiertyd continues to grow its catalogue. It wouldn't be shocking if eMedia Investments shifted all its Bollywood dramas to e.tv but in Zulu as eExtra is being repositioned as the KykNet of their stable.

Synopsis for Uzozisola - Regrets 

Mauli Srivastav and Nandini Verma are best friends who grew up together. Nandini chooses Rajdeep Thakur over Mauli's friendship despite her of warning Nandini of his bad character which leads to a fallout between the two and they part ways.

Mauli, who is now a gynaecologist is married to Dr. Kunal Malhotra who is a pediatrician. Married to Rajdeep, Nandini is a victim of domestic violence. An ambitious businessman and a dominating husband, Rajdeep often abuses Nandini, both physically and mentally.

Kunal sees Nandini at a medical conference and saves her from a major accident. He discovers she is the friend Mauli reminisces about. He discusses it with Mauli. She meets Nandini after seven years. Nandini informs Mauli of her pregnancy. Rajdeep beats Nandini upon hearing about her pregnancy and leaves her on a road. Kunal finds her and takes her to the hospital. Nandini miscarries.

With the support of Mauli & Kunal, she gets Rajdeep arrested on domestic abuse charges and begins to live in Mauli & Kunal's home. He starts falling for her; he reminds himself about Mauli but is unable to stop thinking about Nandini. Slowly, she begins to feel the same for Kunal and decides to leave town due to her inability to control her romantic feelings for him.

When Kunal learns this, he stops her and confesses his own feelings. Nandini and Kunal start to love each other secretly. Mauli is heartbroken upon knowing this and wants to move out his house. Kunal's mother stops her from leaving and forces Kunal to leave instead as he's the one who's wrong. Kunal accepts his mistake and gets out of house. Mauli files for a divorce. After Kunal and Mauli part ways, Kunal and Nandini plan to get married. Mauli finds out that she is pregnant. Kunal discovers this, but accuses her of false pregnancy after a misunderstanding. He marries Nandini and they move out while Mauli decides to go on by herself.

How Cartoon Network Comes Into Affect Under Discovery Global?

Last month, Warner Bros. Discovery announced that they'd be splitting up into two separate companies and not long ago they unveiled the names of these two separate companies. To no one's surprise Warner Bros. and Discovery Global were the names the company took at least a month to figure out.

Warner Bros. under this new structure is technically not even a broadcaster as it houses Warner Bros. Pictures, DC Studios, HBO and it's streaming service HBO Max. Discovery Global retains Discovery Channel, HGTV and TLC while bundling Cartoon Network, TNT and CNN from Warner Bros. 

Some can argue that this is a disbandment of Warner Bros. Discovery but if you look at the structure the cable aspect remains intact. The problem part is that most of the debt about $30 billion goes to Discovery Global.

While Discovery Global on paper owns Cartoon Network and TNT all the content even the trademark remains under Warner Bros. So Discovery Global already being bloated with debt has to pay for shows like The Wonderfully Weird World Of Gumball even to retain the IP on its cable network.

Discovery Global once split from Warner Bros. will obviously try to undo the damage of the merger which may include disinvestment or sale of assets. As for Cartoon Network, how is there any guarantee that Discovery Global will keep up to its commitments.

Neither Warner Bros. and Discovery Global have provided assurances for Warner TV and Toonami's lot brands dependant on their studios to remain afloat. Discovery Global could just use these assets to bolster their remaining offering viewed on HGTV and TLC.