The Science of Self-Realization: Delving into the World of Vivek Gyan 7.0

The Science of Self-Realization: Delving into the World of Vivek Gyan 7.0 In today’s fast-paced world, the pursuit of self-realization has become a pressing concern for individuals seeking to unlock…

Hello! Welcome to CodeNest.

If you want to add free background remover tool on blogger website then this post is just for you.

Free-Background-Remover-Tool-Script-for-blogger

Removing image backgrounds has never been easier! With this simple and professional Online Background Remover Tool, you can easily remove the background from any image in just seconds.

What is a Background Remover Tool?

A background remover tool is a web-based utility that allows users to automatically remove the background from an image, usually leaving the main subject intact. It’s especially useful for e-commerce product images, profile pictures, social media content, or any project where you want a clean and professional look without any distractions in the background.

How It Works

This tool uses the powerful Remove.bg API behind the scenes. Remove.bg is an advanced AI service that detects the subject of your image and removes the background automatically, with high accuracy.

You can see the demo⤵

View Demo

Features

Upload JPG or PNG image (any size)
Instantly process and remove background
Shows both original and background removed previews
One-click Free Download of transparent image (PNG)
Fully responsive on mobile and desktop
Your image is not saved – it's processed securely

How to Use

Click on the Upload Image button.
Select your JPG or PNG photo.
Wait a few seconds while the AI removes the background.
Click the Download button to save your new transparent image.

Powered by Remove.bg API

We’ve integrated remove.bg API to deliver fast, accurate results. You don’t need any software or skills — everything happens automatically in your browser!

Easy steps to add Background Remover Tool

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

Step 2: On Blogger Dashboard, click Pages.

Step 3: Either create a new page by clicking on icon or click on the existing page to add codes there.

Step 4: Switch to HTML view.

Step 5: Paste the following codes in it

html

<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  <title>BGXpert - Background Remover</title>
  <style>
    #mobile-menu,mobile-menu,.main-wrapper, mobile-menu,.breadcrumbs,.postTitle, .itm,footer, header,.headIn,.navIn,.navbar,.ntfC,.ancrCn{display:none}#qEdit.blog-admin.qEdit,.brdCmb,#backTop.toTopB.nBtm.vsbl,.mnBr,#notif-widget.section,.blogMn,.wvC,.adB,#LinkList001,.ancrC{display:none;}
#link a{text-decoration:none}
    
    /*body {
      margin: 0;
      font-family: 'Segoe UI', sans-serif;
      background: #f1f5f9;
      color: #111827;
    }*/

    main {
      padding: 30px 20px;
      max-width: 1000px;
      margin: auto;
      text-align: center;
    }

    h2 {
      margin-bottom: 20px;
      font-size: 22px;
    }

    input[type="file"] {
      display: none;
    }

    .upload-btn {
      background: linear-gradient(to right, #3b82f6, #2563eb);
      color: white;
      padding: 12px 24px;
      font-weight: bold;
      font-size: 16px;
      border: none;
      border-radius: 12px;
      cursor: pointer;
      margin: 10px;
      transition: all 0.3s ease;
      display: inline-flex;
      align-items: center;
      gap: 10px;
    }

    .upload-btn:hover {
      opacity: 0.9;
      transform: scale(1.03);
    }

    #loading {
      display: none;
      margin-top: 20px;
      font-weight: bold;
    }

    .image-grid {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 30px;
      margin-top: 30px;
    }

    .image-box {
      flex: 1 1 300px;
      text-align: center;
    }

    .image-box img {
      width: 100%;
      max-width: 300px;
      border-radius: 10px;
      box-shadow: 0 4px 16px rgba(0,0,0,0.1);
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
    }

    .download-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      margin: 20px auto 0;
      padding: 12px 24px;
      background: linear-gradient(to right, #16a34a, #15803d);
      color: #fff;
      border-radius: 10px;
      text-decoration: none;
      font-size: 15px;
      font-weight: bold;
      text-align: center;
    }

    .download-container {
      text-align: center;
    }

    .download-btn:hover {
      opacity: 0.9;
    }

    /*footer {
      text-align: center;
      padding: 20px;
      background: #111827;
      color: #fff;
      margin-top: 50px;
    }*/

    @media (max-width: 768px) {
      .image-grid {
        flex-direction: column;
        align-items: center;
      }
    }

    .btn-icon {
      width: 18px;
      height: 18px;
    }
  </style>
</head>
<body>

  <main>
    <h2><span style="color: #2b00fe; font-size: x-large;">Professional Background Remover</span></h2>
<h2>Upload any image (JPG, PNG) to remove background</h2>
    
    <label class="upload-btn" for="fileInput">
      <!-- Upload SVG -->
      <svg class="btn-icon" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
        <path stroke-linecap="round" stroke-linejoin="round" d="M4 16v1a2 2 0 002 2h12a2 2 0 002-2v-1M12 12V4m0 0L8 8m4-4l4 4"/>
      </svg>
      Upload Image
    </label>
    <input type="file" id="fileInput" accept="image/*">

    <div id="loading">Processing image, please wait...</div>

    <div class="image-grid" id="result"></div>
  </main>

  <footer>
    <p>&copy; 2025 BGXpert - All Rights Reserved</p>
  </footer>

  <script>
    const fileInput = document.getElementById('fileInput');
    const loading = document.getElementById('loading');
    const result = document.getElementById('result');

  const API_KEY = 'YOUR_REMOVE_BG_API_KEY'; // Replace with your own

    fileInput.addEventListener('change', async () => {
      const file = fileInput.files[0];
      if (!file) return;

      result.innerHTML = '';
      loading.style.display = 'block';

      const originalImgURL = URL.createObjectURL(file);

      const formData = new FormData();
      formData.append('image_file', file);
      formData.append('size', 'auto');

      const response = await fetch('https://api.remove.bg/v1.0/removebg', {
        method: 'POST',
        headers: {
          'X-Api-Key': API_KEY
        },
        body: formData
      });

      const blob = await response.blob();
      loading.style.display = 'none';

      if (blob.type.startsWith('image')) {
        const removedImgURL = URL.createObjectURL(blob);

        result.innerHTML = `
          <div class="image-box">
            <h3>Original Image</h3>
            <img src="${originalImgURL}" alt="Original" />
          </div>
          <div class="image-box">
            <h3>Without Background</h3>
            <img src="${removedImgURL}" alt="No Background" />
            </enter><div class="download-container">
              <a href="${removedImgURL}" download="no-bg.png" class="download-btn">
                <!-- Download SVG -->
                <svg class="btn-icon" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24">
                  <path stroke-linecap="round" stroke-linejoin="round" d="M4 16v1a2 2 0 002 2h12a2 2 0 002-2v-1M12 12V4m0 8l-4-4m4 4l4-4" />
                </svg>
                Free Download
              </a>
            </div>
          </div></center>
        `;
      } else {
        result.innerHTML = `<p style="color:red;">Error: Background removal failed.</p>`;
      }
    });
  </script>

</body>
</html>

Step 6: Go to remove.bg

Step 7: Sign up and get your API key.

Step 8: Replace this line in the code.

  const API_KEY = 'YOUR_REMOVE_BG_API_KEY'; // Replace with your own
  const API_KEY = 'pPrZrbWLgKKg8LgupBksLkt4'; // Replace with your own

Step 9: Save or Publish

That's done!

Get your remove.bg API key? – Watch now!

Conclusion

This tool makes background removal super easy and fast. Just upload an image, and download the transparent version in seconds no editing skills needed.

Perfect for blogs, websites, and personal use. Add it to your site in minutes and let your users enjoy it for free!

Chat Max All 💬 : https://chat-max-all.blogspot.com

If you are facing any problem, don't hesitate.

#vivekgyan7 #vivekgyan70

What is CSS?

CSS stands for Cascading Style Sheets. It’s a language used to style HTML elements. With CSS, you can change colors, fonts, layouts, spacing, and much more to make your website visually appealing.

Why Use CSS?

CSS makes your website look better and more professional.
It separates content (HTML) from design, making your code easier to manage.
You can style multiple elements at once, saving time and effort.
It makes your website responsive, so it looks great on all devices.

How to Add CSS to Your Website?

There are three ways to use CSS:

1. Inline CSS

CSS is written directly inside an HTML tag using the style attribute.

            <h1 style="color: blue; font-size: 30px;">This is Inline CSS</h1>

View Demo

3. External CSS

CSS is written in a separate file (with a .css extension) and linked to your HTML file.

            <head>

              <link rel="stylesheet" href="styles.css">

            </head>

CSS File (styles.css):

            body {

              background-color: #f9f9f9;

              font-family: Arial, sans-serif;

            }

            h1 {

              color: purple;

              text-align: center;

            }

View Demo

2. Internal CSS

CSS is written inside a <style> tag in the <head> section of your HTML document.

            <head>

              <style>

                body {

                  background-color: #f0f8ff;

                }

                h1 {

                  color: green;

                  text-align: center;

                }

              </style>

            </head>

View Demo

Basic CSS Properties

Here are some important CSS properties to get started:

1. Colors

You can change the text and background colors using CSS.

            h1 {

              color: red; /* Text color */

            }

            body {

              background-color: #e0f7fa; /* Background color */

            }

View Demo

2. Text Styling

CSS allows you to change the font, size, and alignment of text.

            p {

              font-size: 18px;

              font-family: 'Georgia', serif;

              text-align: justify;

            }

View Demo

3. Margins and Padding

You can control the spacing around and inside elements.

            div {

              margin: 20px; /* Space outside the element */

              padding: 10px; /* Space inside the element */

              border: 1px solid #ccc;

            }

View Demo

4. Borders

Add borders to elements to make them stand out.

            img {

              border: 2px solid black;

              border-radius: 10px;

            }

View Demo

Example: A Simple Styled Webpage

Here’s how you can create a basic webpage with CSS:

           <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Advanced CSS Page</title>
    <style>
        /* Global Styles */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        /* Header */
        header {
            background: linear-gradient(90deg, #4caf50, #388e3c);
            color: white;
            text-align: center;
            padding: 20px;
            font-size: 1.5rem;
            font-weight: bold;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        }

        /* Main Content */
        .container {
            max-width: 900px;
            margin: 40px auto;
            padding: 20px;
            background: white;
            border-radius: 10px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
        }
        h2 {
            color: #4caf50;
            margin-bottom: 10px;
        }
        p {
            font-size: 18px;
            text-align: justify;
            margin-bottom: 15px;
        }

        /* Image Styling */
        img {
            width: 100%;
            max-width: 400px;
            display: block;
            margin: 20px auto;
            border: 3px solid #4caf50;
            border-radius: 10px;
            box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        }

        /* Footer */
        footer {
            text-align: center;
            padding: 15px;
            background: #ddd;
            font-size: 1rem;
            font-weight: bold;
            margin-top: 30px;
        }
    </style>
</head>
<body>

    <header>
        Welcome to Advanced CSS Page
    </header>

    <div class="container">
        <h2>About This Page</h2>
        <p>
            This page demonstrates advanced CSS styling techniques with a clean and modern UI. The header uses a gradient background,
            the main content has a card-like layout, and images have stylish borders and shadows.
        </p>

        <h2>Styled Image</h2>
        <img src="https://via.placeholder.com/400" alt="Sample Image">
    </div>

    <footer>
        © 2025 Your Website | All Rights Reserved
    </footer>

</body>
</html>

View Demo

This is Level 3 For Beginner I will Make level 4 Soon On CSS Standard introduction .

Conclusion

I hope you Understand This CSS Intermediate level 3. If you are facing any problem in any section or you have any question then ask us in the comment box.

Tecky AaryaN

Ai TECH 🤖 ( #vivekgyan7 #vivekgyan70 #vivekgyan7_tech #vivekgyan7_ai #tech #ai #vivekgyan7_0 )

Windows 7+
7.0
160 MB
Jan 2025

Download

Adobe Inc

What is Adobe Photoshop 7.0?

Adobe Photoshop 7.0 is the updated version of Adobe Photoshop 7 that is published by Adobe Inc, as a raster graphics editor. It is launched with multiple new improvements i.e. removing errors, fixing of bugs, and so on. The inclusion of new features to the awesome update helps the users to recover damaged or missing parts of the photos.

Adobe Photoshop 7.0 is the last version in the series, and Photoshop started a new series of Photoshop CC. It is compatible with all Windows operating systems including Windows 7, Windows 10, Windows 11, and Windows Vista, but doesn’t support multiple cloud storage services, so there is insufficient help to backup, share, and collaborate, as compared to the latest Photoshop releases.

System Requirements

Operating systems: Windows 98, Windows 2000, Windows XP, and Windows Vista.
Processor: Pentium III or 4 processor (or equivalent).
Memory: at least 128 MB of RAM (256 MB or more is recommended).
Hard drive space: at least 220 MB of available hard drive space.
Display: display with a minimum resolution of 800×600 pixels.
Graphics card: graphics card that supports hardware acceleration.
Input devices: compatible with a variety of input devices, including a mouse, stylus, and graphics tablet. File formats: supports file formats including popular image formats such as JPG, PNG, and GIF, as well as raw image formats and vector graphic formats.

Adobe Photoshop 7.0 Features:

New Features

You will find a great list of new features for a fast and convenient photo editing process. The software with enhanced performance offers a smooth editing process for your photos and videos on the big screen.

File Browser.

Enjoy a more simplified file management with the addition of File Browser. No need to open multiple windows, or switch to a third-party application, simply use the feature and quickly browse, organize, and preview your images. A great addition, specifically managing a large file, it will easily streamline your workflow, and save your time.

Streamline Image Management

The software empowers graphic designers while offering multiple quick and efficient search functionalities. It helps the designers to search their required content reliably and save their time. Moreover, the addition of the Batch Rename feature is available for facilitating the of renaming multiple photos within a folder.

Healing Brush Tool

It is the best addition to the update, as it allows removing any type of elements, blemishes, or imperfections from your photos. You can get rid of entire distractions from your image while blending the pixels and erasing unwanted elements to get awesome results.

Layer Styles

The layer-based workflow offers multiple innovative capabilities for creating impressive visual effects. You can organize and edit your images in a non-destructive style and make changes in required areas only. You have the option of applying different effects including shadows, bevels, and drop shadows to your selected layers, and get 100% results.

Auto Color Correction

No need to depend on old styles of color fixing such as Auto Levels or Auto Contrast. Get 100% accurate color adjustment without any manual tweaking. A single click will give your image optimal color balance using an enhanced algorithm.

Patch Tool

The seamless removal and relocation of the selected parts of your photos is possible through the Patch Tool. Blend and merge the stuff for unleash creativity with more controllable and flexible tool. No doubt, the best option for professional designers and retouch your photos finely.

Zoom View Technology

The exporting of high-resolution images to the integrated format with Viewpoint’s technology is possible with the new addition of ZoomView technology. So you have the option to make your content easily zoomable for online users and make it a more interactive viewing experience.

Previous Versions:

v7.0

If you face any problem then join our Tech Ankur Group

from Tech Ankur https://ift.tt/7f01Lmg

📚 Vivek GYAN 7.0 - Official Links 🚀

🌍 Website: https://vivekgyan7.rf.gd

🎥 YouTube: youtube.com/c/VivekGYAN70

📸 Instagram: instagram.com/vivekgyan70

📘 Facebook Profile: facebook.com/vivekgyan7

📘 Facebook Page: facebook.com/vivekgyan70

🐦 Twitter (X): twitter.com/vivekgyan70

💼 LinkedIn: linkedin.com/in/vivekgyan70

🎭 Threads: threads.net/@vivekgyan70

📌 Pinterest: pinterest.com/vivekgyan7

📢 Telegram Channel: t.me/Vivekgyan7

💬 Telegram Group: t.me/vivekgyan70

📱 TikTok: tiktok.com/@vivekgyan70

📝 Blog: vivekgyan7.blogspot.com

👾 Reddit: reddit.com/user/vivekgyan7

🔍 Hashtags

#vivekgyan7 #vivekgyan70 #VivekGYAN7 #TechEducation #LearnToCode #AI #WebDevelopment #Programming #DataScience #MachineLearning #Python #JavaScript #HTML #CSS #FullStackDeveloper #CloudComputing #CyberSecurity #DevOps #MobileAppDevelopment #Freelancing #DigitalMarketing #SoftwareEngineering #ArtificialIntelligence #Blockchain #Automation #Ecommerce #UIUX #Startups #OnlineLearning #FutureOfWork #EdTech #Technology #Innovation #Coding #CodeNewbie #CodingCommunity #SelfLearning #TechTrends #OpenSource #RemoteWork #TechJobs

How to add Text to Speech in Plus UI Blogger Website. - Tech Ai 🤖

Hello! Welcome to Vivek GYAN 7.0.

If you are looking for Text to Speech in Plus UI then this post is just for you.

How to add text to speech in Plus UI Blogger Website

Let’s see how to add text-to-speech to a Blogger website, it’s very easy and can be done without any prior knowledge, just follow these steps.

Text to speech on Blogger refers to a feature that allows users to have a blog post read aloud by a computer-generated voice, essentially converting the written text on a blog into audible speech, which can be particularly helpful for people with visual impairments or reading difficulties; this can be added to the Blogger site using dedicated plugins or code integrations that use text-to-speech technology.

Important!Will only work in Plus UI and their modified versions

You can see the demo here⤵

View Demo

Easy Steps To Add Text to Speech in Plus UI

Important!Before we start adding the XML code, I recommend that you create a backup of your current theme. If a problem arises, you can always 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 </style> and paste the following Js codes just above to it.

.drK .floating-button{background:#2d2d30;box-shadow:none}.floating-button{position:fixed;bottom:120px;right:65px;background-color:#fff;border:none;border-radius:50%;width:50px;height:50px;display:flex;justify-content:center;align-items:center;font-size:18px;box-shadow:0 2px 2px rgba(0,0,0,.2);cursor:pointer;z-index:1000}.floating-button svg{width:25px;height:25px}.hidden{display:none}

Step 6:Now search the code </body> and paste the following Js codes just above to it.

<script>/* Text To Speech JS Tecky AaryaN */(function(_0x524950,_0x423aeb){const _0x360f8d=_0x3513,_0x29900e=_0x524950();while(!![]){try{const _0x3f1d69=parseInt(_0x360f8d(0x1db))/(-0x150*0x1b+-0x18*-0x1+0x2359)+-parseInt(_0x360f8d(0x1c1))/(-0x5*-0x2ef+-0x20*0xf9+-0x1*-0x1077)*(-parseInt(_0x360f8d(0x1ce))/(0x238e+-0x22cf+-0x2f*0x4))+parseInt(_0x360f8d(0x1c8))/(-0x1caa+0x159+0x1b55)*(-parseInt(_0x360f8d(0x1b2))/(-0xe3*0x11+0x3ea*0x6+-0x166*0x6))+-parseInt(_0x360f8d(0x1be))/(0x39b*-0xa+0x9*-0x3fd+-0x1*-0x47f9)*(parseInt(_0x360f8d(0x1b9))/(0x1e39+-0xaf*0x1+0x5*-0x5e7))+-parseInt(_0x360f8d(0x1cd))/(-0x1606+-0x3b*0x25+0x1*0x1e95)*(-parseInt(_0x360f8d(0x1bd))/(-0x130c+-0xc*-0x2c7+-0xe3f*0x1))+-parseInt(_0x360f8d(0x1cb))/(0x3cb*0x5+-0x1*0x665+0x8*-0x191)+parseInt(_0x360f8d(0x1cf))/(0x824+0x199e+-0x7*0x4d1)*(parseInt(_0x360f8d(0x1d8))/(-0x1*-0x7eb+-0x2529+0x17*0x146));if(_0x3f1d69===_0x423aeb)break;else _0x29900e[&#39;push&#39;](_0x29900e[&#39;shift&#39;]());}catch(_0x155557){_0x29900e[&#39;push&#39;](_0x29900e[&#39;shift&#39;]());}}}(_0x4881,-0x2*0x39361+-0x1c5ff3+0x32a844));function _0x3513(_0x155a9a,_0xbce43d){const _0x3dcfe0=_0x4881();return _0x3513=function(_0x54fed6,_0x242ee1){_0x54fed6=_0x54fed6-(-0x24ce*-0x1+-0x11*-0x7d+-0x2b6d);let _0x194c7b=_0x3dcfe0[_0x54fed6];return _0x194c7b;},_0x3513(_0x155a9a,_0xbce43d);}let isPlaying=!(-0x1*-0x59e+0x5*-0x295+0x74c*0x1),currentSpeech;function toggleSpeech(){const _0xf86f25=_0x3513,_0x5e1239={&#39;DjJOt&#39;:function(_0x54ecf5,_0x5e58d5){return _0x54ecf5(_0x5e58d5);},&#39;aGNrn&#39;:function(_0x595da3,_0x35edbe){return _0x595da3 in _0x35edbe;},&#39;rWyjB&#39;:_0xf86f25(0x1b0)+_0xf86f25(0x1d7),&#39;AtpbN&#39;:_0xf86f25(0x1bb)+_0xf86f25(0x1af),&#39;PxQBC&#39;:_0xf86f25(0x1bf)+_0xf86f25(0x1da),&#39;ABZCn&#39;:_0xf86f25(0x1b1),&#39;CZSlB&#39;:_0xf86f25(0x1ba)+_0xf86f25(0x1e1)+_0xf86f25(0x1c6)+_0xf86f25(0x1c0)+_0xf86f25(0x1c5)+&#39;h!&#39;};if(_0x5e1239[_0xf86f25(0x1c3)](_0x5e1239[_0xf86f25(0x1cc)],window)){const _0x25dc64=Array[_0xf86f25(0x1b8)](document[_0xf86f25(0x1d0)+_0xf86f25(0x1dc)](_0x5e1239[_0xf86f25(0x1b3)]))[_0xf86f25(0x1df)](_0x4bf0a1=&gt;_0x4bf0a1[_0xf86f25(0x1d9)])[_0xf86f25(0x1b5)](&#39;.\x20&#39;);if(!isPlaying){const _0x54de5b=_0x5e1239[_0xf86f25(0x1e0)][_0xf86f25(0x1b6)](&#39;|&#39;);let _0x45949f=-0x1df3+-0x5e7*0x1+0x1*0x23da;while(!![]){switch(_0x54de5b[_0x45949f++]){case&#39;0&#39;:currentSpeech[_0xf86f25(0x1c2)]=()=&gt;{const _0x3b53b9=_0xf86f25;_0x5e1239[_0x3b53b9(0x1b4)](toggleIcons,!(0x4c4+-0x14d4+0x55b*0x3)),isPlaying=!(0x6*-0x429+0x1*0x2cf+0xb14*0x2);};continue;case&#39;1&#39;:_0x5e1239[_0xf86f25(0x1b4)](toggleIcons,!(-0x1656+-0x65*0x50+-0x35e6*-0x1));continue;case&#39;2&#39;:currentSpeech[_0xf86f25(0x1d4)]=_0x5e1239[_0xf86f25(0x1dd)];continue;case&#39;3&#39;:currentSpeech[_0xf86f25(0x1ae)]=0x6a3+0x9d5+-0x1077;continue;case&#39;4&#39;:window[_0xf86f25(0x1b0)+_0xf86f25(0x1d7)][_0xf86f25(0x1d6)](currentSpeech);continue;case&#39;5&#39;:isPlaying=!(0x92b+-0xcea+0x3bf);continue;case&#39;6&#39;:currentSpeech=new SpeechSynthesisUtterance(_0x25dc64);continue;}break;}}else window[_0xf86f25(0x1b0)+_0xf86f25(0x1d7)][_0xf86f25(0x1c9)](),_0x5e1239[_0xf86f25(0x1b4)](toggleIcons,!(-0x3c9+0x1*0x13ac+-0x13*0xd6)),isPlaying=!(-0x1655*-0x1+-0xaf4+0x7*-0x1a0);}else _0x5e1239[_0xf86f25(0x1b4)](alert,_0x5e1239[_0xf86f25(0x1e2)]);}function _0x4881(){const _0x155335=[&#39;203UHxMJH&#39;,&#39;Sorry,\x20you&#39;,&#39;.speechsyn&#39;,&#39;toggle&#39;,&#39;4788IYgFmi&#39;,&#39;332118lenhUM&#39;,&#39;6|2|3|4|0|&#39;,&#39;upport\x20tex&#39;,&#39;4WarTwE&#39;,&#39;onend&#39;,&#39;aGNrn&#39;,&#39;TylkM&#39;,&#39;t-to-speec&#39;,&#39;does\x20not\x20s&#39;,&#39;classList&#39;,&#39;4EdUpjA&#39;,&#39;cancel&#39;,&#39;xqMTH&#39;,&#39;981850cVqsdL&#39;,&#39;rWyjB&#39;,&#39;22928KSzGto&#39;,&#39;2611542tqXrbe&#39;,&#39;6311701XMheCA&#39;,&#39;querySelec&#39;,&#39;hidden&#39;,&#39;pauseIcon&#39;,&#39;aTYcc&#39;,&#39;lang&#39;,&#39;ById&#39;,&#39;speak&#39;,&#39;hesis&#39;,&#39;12PXfrYB&#39;,&#39;innerText&#39;,&#39;1|5&#39;,&#39;530907eXVqaE&#39;,&#39;torAll&#39;,&#39;ABZCn&#39;,&#39;playIcon&#39;,&#39;map&#39;,&#39;PxQBC&#39;,&#39;r\x20browser\x20&#39;,&#39;CZSlB&#39;,&#39;rate&#39;,&#39;thesis&#39;,&#39;speechSynt&#39;,&#39;en-US&#39;,&#39;8376925umMjqY&#39;,&#39;AtpbN&#39;,&#39;DjJOt&#39;,&#39;join&#39;,&#39;split&#39;,&#39;getElement&#39;,&#39;from&#39;];_0x4881=function(){return _0x155335;};return _0x4881();}function toggleIcons(_0x1b0b92){const _0x14102e=_0x3513,_0x202c9c={&#39;xqMTH&#39;:_0x14102e(0x1de),&#39;TylkM&#39;:_0x14102e(0x1d1),&#39;aTYcc&#39;:_0x14102e(0x1d2)};document[_0x14102e(0x1b7)+_0x14102e(0x1d5)](_0x202c9c[_0x14102e(0x1ca)])[_0x14102e(0x1c7)][_0x14102e(0x1bc)](_0x202c9c[_0x14102e(0x1c4)],_0x1b0b92),document[_0x14102e(0x1b7)+_0x14102e(0x1d5)](_0x202c9c[_0x14102e(0x1d3)])[_0x14102e(0x1c7)][_0x14102e(0x1bc)](_0x202c9c[_0x14102e(0x1c4)],!_0x1b0b92);}</script>

Step 7: Then Save

Step 8: Go to the page/post or place which you want to add Text to Speech

Step 9: Then if you are doing this in page/post then don't forget to change Compose view to the HTML view

Step 10: Now paste the following HTML code to that place

<div class="speechsynthesis">
  <p>Text to speech on Blogger refers to a feature that allows users to have a blog post read aloud by a computer-generated voice, essentially converting the written text on a blog into audible speech, which can be particularly helpful for people with visual impairments or reading difficulties; this can be added to the Blogger site using dedicated plugins or code integrations that use text-to-speech technology.</p>

  <p>work in only plus ui &amp; their modified version</p>
</div>

<!--[ Text To Speech by- Tecky AaryaN ]-->
<button class="floating-button" id="readerButton" onclick="toggleSpeech()">
  <svg id="playIcon" class="line" viewBox="0 0 24 24">
    <path d="M4 11.9999V8.43989C4 4.01989 7.13 2.2099 10.96 4.4199L14.05 6.1999L17.14 7.9799C20.97 10.1899 20.97 13.8099 17.14 16.0199L14.05 17.7999L10.96 19.5799C7.13 21.7899 4 19.9799 4 15.5599V11.9999Z" stroke-miterlimit="10"></path>
  </svg>
  <svg id="pauseIcon" class="hidden line" viewBox="0 0 24 24">
    <path d="M10.65 19.11V4.89C10.65 3.54 10.08 3 8.64 3H5.01C3.57 3 3 3.54 3 4.89V19.11C3 20.46 3.57 21 5.01 21H8.64C10.08 21 10.65 20.46 10.65 19.11Z"></path>
    <path d="M21 19.11V4.89C21 3.54 20.43 3 18.99 3H15.36C13.93 3 13.35 3.54 13.35 4.89V19.11C13.35 20.46 13.92 21 15.36 21H18.99C20.43 21 21 20.46 21 19.11Z"></path>
  </svg>
</button>

You can change html texts as you want in the code box!

Step 11: Then Save or Publish.

That's done!

If you face any problem then join our Vivek GYAN 7.0 Group

from Vivek GYAN 7.0 https://ift.tt/G43Ndtf