Transparent Logo Overlapping with Content + Alignment Issue (Screenshots Included)

IbrahimWB · ‎09-30-2024

Hi everyone,

I’m having some issues with my store's layout and could use some help. I’ve noticed that my transparent logo is overlapping with content as I scroll down the page, and I’m unsure how to fix it.

Additionally, I’m struggling with the alignment of two elements:

On the product page, I want to elevate the WhatsApp icon (in the bottom right) to match the height of the currency converter.
On the home page, I need the opposite: to lower the currency converter so it aligns with the WhatsApp icon at the bottom.

It’s important to note that the heights of these icons are different on the home page vs. the product page. I’ve attached two screenshots to give a clearer idea of what I mean.

I’d really appreciate any guidance on how to adjust these elements and fix the overlapping issue.

Thanks in advance for your help!

Kind Regards,
Ibrahim W.

Dan-From-Ryviu · ‎09-30-2024

Hi @

You can add this code to theme.liquid file, after <head> in Online Store > Themes > Edit code to edit position of currency and whats app icons

{% if template == 'index' %}
<style>
.bacurr-cur-blocker .baDropdownStyle.mobile_bottom_left {
   bottom: -20px !important;
}
</style>
{% endif %}
{%- if template.name contains 'product' -%}
.whatsapp-widget {
    bottom: 49px !important;
}
<style>
</style>
{%- endif -%}

- Helpful? Like and Accept solution! Support me! Buy me coffee
- Ryviu - Reviews & QA app: Collect product reviews, import reviews from AliExpress, Amazon, Etsy, Walmart, Shopee, Dhgate and CSV.
- Lookfy Gallery: Lookbook Image: Easy and fast to create Photo Gallery, Lookbook, Shop The Look.
- Ryviu: Aliexpress Reviews - AliExpress Reviews Importer, one-click import aliexpress reviews, export reviews to CSV file.
- Reelfy‑Shoppable Videos+Reels: Create shoppable videos to engage customers and drive more sales.
- Enjoy 1 month of Shopify for $1. Sign up now.

IbrahimWB · ‎10-02-2024

Hi,
I'm sorry. I followed your instruction, I placed the above code under <head> in theme.liquid file, but there seems to be no change.
I reccently changed my domain for the store, maybe it could due to that?
the original domain now is www.barakatcharger.com
Thank you so much for you response!
Kind Regards,
Ibrahm W.

Transparent Logo Overlapping with Content + Alignment Issue (Screenshots Included)

Transparent Logo Overlapping with Content + Alignment Issue (Screenshots Included)

Community Blog Articles