Announcement

Collapse
No announcement yet.

Expanding Header help - CORE theme

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Expanding Header help - CORE theme

    So, I'm using the Furniture Core theme for our site and in the past (old pre html5 theme) when we needed to make an announcement, we put text in the global head to show on the site and the top area expanded to show this text. Now, when I do the same thing with the new core theme, the header area does not expand. In fact, on the non-mobile site view and the "tablet" view, it puts the text behind our logo, but on the mobile device view, the text is put below the logo (which is how we envisioned it in the first place). Anyone have any suggestions on how to get the text to be below the logo all the time (and have the header grow in height to accomodate the text)?

    (ideally, I'd like the text to spread under the main categories menu, but that may mess things up in the mobile view)

    https://www.refcloset.com for reference.

  • #2
    You need to take your text block out of the logo div:

    Here is what you have:
    HTML Code:
    <div class="logo">
    <a href="https://www.refcloset.com"><img alt="Refcloset" src="assets/images/Company/refcloset-small.jpg" border="0" align="middle"></a><br><div style="width: 100%; border-style:solid; bgcolor:#ffffff">Please note: We are in the process of re-designing our website and adding new improvements. Please bear with us as we finalize this process which may involve testing some back-end components.</div>
    </div>
    Here is what you should change it to:
    HTML Code:
    <div class="logo">
    <a href="https://www.refcloset.com"><img alt="Refcloset" src="assets/images/Company/refcloset-small.jpg" border="0" align="middle"></a><br>
    </div>
    <div style="width: 100%; border-style:solid; background-color:#ffffff">Please note: We are in the process of re-designing our website and adding new improvements. Please bear with us as we finalize this process which may involve testing some back-end components.</div>
    Also make sure that you are using modern style rules.

    bgcolor:#ffffff should be background-color:#ffffff
    TheCartDesigner.com
    Not 3dcart Owned or Operated
    100% Independent 3dcart Expert


    Follow Us on Twitter

    Comment


    • #3
      Thanks for the information. Unfortunately, that means that the "global header" section of the cart admin is pretty much useless on that template since the logo div was put in by the template and within that div is where the frame.html has the global header tags.

      It looks like I may be better off hard coding the logo into the logo div and moving the global header tag outside of the logo div so I can actually use the global header section of the cart admin to put messages if necessary. If not, I'd have to change the frame.html every time I want to change a message. Am I wrong in my thinking??
      Last edited by jnnjr; 04-05-2019, 12:14 PM.

      Comment


      • #4
        No need to hard code it. If the logo div is wrapping the global, just change these 2 rules instead in your css file:

        .logo {
        height: auto; /*changed from 135px*/
        position: relative;
        overflow: hidden;
        }

        .logo img {
        position: relative; /*changed from absolute*/
        top: 0;
        right: auto;
        bottom: 0;
        left: 0;
        margin: auto;
        max-width: 100%;
        max-height: 100%;
        }
        TheCartDesigner.com
        Not 3dcart Owned or Operated
        100% Independent 3dcart Expert


        Follow Us on Twitter

        Comment


        • #5
          AWESOME! Thank you so much for your help.

          Comment

          Working...
          X