Can we add floating png on index page ?

[jkneon]

Hey guys,

I am using Duende V3 theme and want to know if its possible to add the floating png with href link on index or on full forum pages ?

Regards.

[Xferno]

cope and paste this on the bottom of header template

<div id="floating-image">
    <a href="https://example.com" target="_blank">
        <img src="https://yourwebsite.com/path-to-image.png" alt="Floating Image">
    </a>
</div>

and add this css on global.css

#floating-image {
    position: fixed;
    bottom: 20px;  /* Adjust this value to control the vertical position */
    right: 20px;   /* Adjust this value to control the horizontal position */
    z-index: 9999; /* Ensure the image stays on top of other elements */
}

#floating-image img {
    max-width: 100px; /* Adjust the size of your image here */
    max-height: 100px;
}

#floating-image:hover img {
    opacity: 0.8; /* Add hover effect if you like */
}

[jkneon]

cope and paste this on the bottom of header template

<div id="floating-image">
    <a href="https://example.com" target="_blank">
        <img src="https://yourwebsite.com/path-to-image.png" alt="Floating Image">
    </a>
</div>

and add this css on global.css

#floating-image {
    position: fixed;
    bottom: 20px;  /* Adjust this value to control the vertical position */
    right: 20px;   /* Adjust this value to control the horizontal position */
    z-index: 9999; /* Ensure the image stays on top of other elements */
}

#floating-image img {
    max-width: 100px; /* Adjust the size of your image here */
    max-height: 100px;
}

#floating-image:hover img {
    opacity: 0.8; /* Add hover effect if you like */
}

Is it possible to change the direction of the floating image into left or right ?

[PARADOX987]

Simply add set an animation to the image or set the image inside of marquee element .

[Xferno]

#floating-image {
    position: fixed;
    bottom: 20px;  /* Adjust this value to control the vertical position */
    right: 20px;  /* Adjust this value to control the horizontal position */
    z-index: 9999; /* Ensure the image stays on top of other elements */
}

edit the right eliment