Image like trusted shop on all website

Hi,

You can add a widget area to your header ( https://kriesi.at/documentation/enfold/header/#adding-a-header-widget-area ), add this image to your header widget area, and then position it as needed using custom CSS in the Enfold theme options > General Styling > Quick CSS field.

Regards,
Yigit

Hi,

Thanks for the update. If you need help with adding a widget area then we would need access to your site, please post login details in private. Also make sure that you have a backup of your site.

Best regards,
Rikard

Hi,
Thank you for the link to your site and the images, I converted one of them to a png and made the edge transparent and then added this css to your Quick CSS and now the badge shows in the bottom right corner on all pages, desktop & mobile.

body:not(.wp-admin)::before {
  content: "";
  position: fixed;
  right: 10px;
  bottom: 10px;
  width: 100px;
  height: 50px;
  background-image: url(/wp-content/uploads/2024/05/ISO_9001_farbe_de.png);
  z-index: 99;
  background-size: contain;
  background-repeat: no-repeat;
}

please clear your browser cache and check and adjust the size and position to suit.

Best regards,
Mike

Hi,
Unfortunately pseudo-elements can not be links so we will need to start over, so remove the other css. I couldn’t login so try to follow these steps.
If you are not using a child theme you could use the WP Code plugin then add a new snippet, in the top right corner use the PHP snippet as the code type:

and ensure that it is activated, then add this code and save.

function custom_floatingBadge_script() { ?>
  <script>
document.addEventListener('DOMContentLoaded', function() {
    var badge = document.createElement('div');
    badge.id = 'floatingBadge';
    badge.className = 'floating-badge';
    document.body.appendChild(badge);

    badge.addEventListener('click', function() {
        window.open('https://www.example.com', '_blank'); // Replace with your desired URL
    });
});
</script>
  <?php
}
add_action( 'wp_footer', 'custom_floatingBadge_script', 99 );

Please ensure to copy the code from the forum and not an email notification so the symbols are not converted, and then change the link to suit.
Then add this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

.floating-badge {
    position: fixed;
    right: 10px;
    bottom: 10px;
    width: 170px;
    height: 100px;
    background-image: url(https://www.idea-innovation-consulting.com/wp-content/uploads/2024/05/ISO_9001_farbe_de.png);
    z-index: 99;
    background-size: contain;
    background-repeat: no-repeat;
    cursor: pointer;
}

Best regards,
Mike

Hi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

Best regards,
Mike