Text not showing up on mobile banner

Solved
Highlighted
Excursionist
16 0 5

I am using the purchased theme Artisan and the text is not showing up on our main banners on mobile, only desktop.

The site is broughttoreality.com

Can someone help? Thank you so much

0 Likes
Highlighted
Shopify Partner
2317 504 654

Hey @btr-clothing,

Please add the following code at the end of your assets/style.scss file.

@media only screen and (max-width: 798px){
h1.headline { color: #000000 }   
}

 

Let me know if this works for you.

Thanks! 

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes
Highlighted
Excursionist
16 0 5

Hi there, thank you but unfortunately that did not work

0 Likes
Highlighted
Shopify Partner
2317 504 654

Still that script on your website ?

Then I will check.

 

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes
Highlighted
Excursionist
16 0 5

It is still there, yes

0 Likes
Highlighted
Shopify Partner
2317 504 654

Hey @btr-clothing,

I can see there is some problem with the theme.

check your layout/theme.liquid file. Try to find out the following. check screenshot. We will have to remove "!important".

important.jpg

 

If you enable to do that, please send me your theme zip. I will find and remove that. Then the above given code will work for mobile.

 

Thanks!

 

 

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes
Highlighted
Excursionist
16 0 5

That's not working either, how do I paste to you the html code I am seeing? I'm not seeing an option to export the html code unfortunately. I appreciate your help on this

0 Likes
Highlighted
Shopify Partner
2317 504 654

Hey @btr-clothing,

Just paste html here.

Thanks!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes
Highlighted
Excursionist
16 0 5
{% capture content %}
<!DOCTYPE html>
<!--[if IE 9 ]><html class="ie ie9" lang="{{ shop.locale }}"> <![endif]-->
<!--[if (gte IE 10)|!(IE)]><!--><html lang="{{ shop.locale }}"> <!--<![endif]-->
<head>
  <meta charset="utf-8">
  <meta http-equiv="cleartype" content="on">
  <meta name="robots" content="index,follow">
 
  <!-- Stylesheets for Artisan 1.3.2 -->
  {{ 'styles.scss.css' | asset_url | stylesheet_tag }}
 
  <noscript>
    <style>
      .slideshow {
        opacity: 1;
      }
 
      .product_gallery {
        opacity: 1;
      }
 
      .mainBar__container.overflow--hidden {
        overflow: visible;
      }
 
      .newsletter-popup.remodal {
        display: none;
      }
 
      .fallbackImage {
        max-width: 100%;
      }
 
      .noscript {
        display: block;
      }
 
      img.lazyload[src*="_100x"],
      img.lazyload[src*="_50x"] {
        display: none;
      }
 
      .product_gallery_nav {
        display: none;
      }
    </style>
  </noscript>
 
  {% if current_tags %}{% assign meta_tags = current_tags | join: ', ' %}{% endif %}
  <title>{% if template contains "index" %}{{ page_title }}{% else %}{{ page_title }}{% if current_tags %} {{ 'general.meta.tagged_html' | t: tags: meta_tags }}{% endif %}{% if current_page != 1 %} {{ 'general.meta.page' | t: page_number: current_page }}{% endif %}{% unless page_title contains shop.name %} - {{ shop.name }}{% endunless %}{% endif %}</title>
 
  {% if page_description %}
    <meta name="description" content="{{ page_description | escape }}{% if current_tags %} {{ 'general.meta.tagged_html' | t: tags: meta_tags | escape }}.{% endif %}{% if current_page != 1 %} {{ 'general.meta.page' | t: page_number: current_page }}.{% endif %}" />
  {% endif %}
 
  {% render 'social-meta-info' %}
  {% if collection.previous_product %}<link rel="prev" href="{{ collection.previous_product }}">{% endif %}
  {% if collection.next_product %}<link rel="next" href="{{ collection.next_product }}">{% endif %}
 
  <!-- Mobile Specific Metas -->
  <meta name="HandheldFriendly" content="True">
  <meta name="MobileOptimized" content="320">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <meta name="theme-color" content="{{ settings.shop_bg_color }}">
 
  {% if settings.favicon != nil %}
    <link rel="shortcut icon" type="image/x-icon" href="{{ settings.favicon | img_url: '180x180' }}">
    <link rel="apple-touch-icon" href="{{ settings.favicon | img_url: '180x180' }}"/>
    <link rel="apple-touch-icon" sizes="72x72" href="{{ settings.favicon | img_url: '72x72' }}"/>
    <link rel="apple-touch-icon" sizes="114x114" href="{{ settings.favicon | img_url: '114x114' }}"/>
    <link rel="apple-touch-icon" sizes="180x180" href="{{ settings.favicon | img_url: '180x180' }}"/>
    <link rel="apple-touch-icon" sizes="228x228" href="{{ settings.favicon | img_url: '228x228' }}"/>
  {% else %}
    <link rel="shortcut icon" type="image/x-icon" href="{{ 'favicon.png' | asset_url }}">
  {% endif %}
  <link rel="canonical" href="{{ canonical_url }}" />
 
  <script>
    {% render 'js-variables' %}
  </script>
 
  {% if template contains 'customer' %}
    {{ "shopify_common.js" | shopify_asset_url | script_tag }}
    {{ "customer_area.js" | shopify_asset_url | script_tag }}
  {% endif %}
  {{ content_for_header }}
<script id="sg-js-global-vars">
                        sgGlobalVars = {{ shop.metafields['sg-cc']['sg-metafield'] | json }};
                        if(sgGlobalVars) {
                            sgGlobalVars.cart = {{ cart | json }};
                            sgGlobalVars.currentProduct = {{ product | json }};
                            sgGlobalVars.isAdmin = {% if content_for_header contains 'adminBarInjector' or content_for_header contains 'previewBarInjector' %}true{% else %}false{% endif %};
                        }
                    </script></head>
 
{% for locale in shop.enabled_locales %}
  {% if locale.primary == true %}
    {% assign defaultLocale = locale.iso_code %}
  {% endif %}
{% endfor %}
 
<body class="{{ template | replace: '.', '-' | handle }}"
  data-money-format="{% if settings.currency_format == 'money_with_currency_format' %}{{ shop.money_with_currency_format | strip_html }}{% else %}{{ shop.money_format | strip_html }}{% endif %}"
  data-shop-url="{{ shop.url }}"
  data-active-currency="{{ shop.currency }}",
  data-currency-format="{{ settings.currency_format }}",
  data-default-lang="{{ defaultLocale }}"
  data-default-currency="{{ shop.currency }}"
  data-current-currency="{{ cart.currency.iso_code }}"
  data-current-lang="{{ request.locale.iso_code }}">
 
  {% section 'header' %}
 
  <div class="shapesOverflow">
    {{ content_for_layout }}
 
    {% section 'footer' %}
  </div>
 
  {% section 'popup' %}
 
  {% if settings.disqus_enabled %}
    {% if template contains "blog" or template contains "article" or template contains "index" %}
      <script id="dsq-count-scr" src="//{{ settings.disqus_shortname }}.disqus.com/count.js" async></script>
    {% endif %}
  {% endif %}
  {% if settings.shipping_calc and shop.enabled_currencies.size > 1 %}
    <script type="text/javascript" src="/services/javascripts/currencies.js"></script>
    <script defer src="{{ 'currencies.js' | asset_url }}"></script>
  {% endif %}
  <script>
    {% render 'js-variables' %}
  </script>
  <script src="{{ 'app.js' | asset_url }}"></script>
 
  {% if settings.shipping_calc and template contains "cart" %}
    {% render 'currencies' %}
    {% render 'cart-shipping-scripts' %}
  {% endif %}
</body>
</html>
{% endcapture %}
{% assign content = content | replace_first: '<!DOCTYPE', '!DOCTYPE' | split: ' <' %}
{% for html in content %}{% assign htmlblock = html | strip | prepend: ' <' %}{{htmlblock | replace: ' </', '</'}}{% endfor %}
 
@media screen and (max-width: 767px) { .index-section.slideshow-container {
position: relative;
}
.slideshow__mobile-text-container {
position: absolute;
top: 32%;
z-index: 999;
left: 0;
right: 0;
background: #000;
opacity: .6;
}
.slideshow__mobile-text-container h2 {
color: #000000;
width: 100% ;
}}
0 Likes
Highlighted
Excursionist
16 0 5

That is the code for the page Layout / theme.liquid

0 Likes