0
Welcome Guest! Login
0 items Join Now

Logo for mobile view

    • Esther's Avatar
    • Esther
    • Newbie
    • Posts: 5
    • Thanks: 0

    Logo for mobile view

    Posted 9 years 7 months ago
    • Hi,
      I'm using rt-lexicon template on a joomla 3.3 installation. The logo is very big (in fact, it takes all the templates width) so it doesn't resize well when visiting the website from a telephone. How could I change the logo for responsive views? Is it possible?
      Thank you very much.
    • MrT's Avatar
    • MrT
    • Preeminent Rocketeer
    • Posts: 101084
    • Thanks: 13484
    • Web Designer/Developer

    Re: Logo for mobile view

    Posted 9 years 7 months ago
    • Please do not post extensions/template specific questions in the "General Discussion" forum. You should post in the extension forum or template forum as appropriate. Most of these forums are for members who have a current PAID membership. Our priority is always to assist paying members.

      Thank you for your understanding.

      Your subscription appears to have expired? Support requires a current subscription.

      Yes, you can do this with custom CSS. You will also need to use media queries too to detect the viewport size.
      /* Smartphones */
      @media (max-width: 480px) {
      
      }
       
      /* Smartphones to Tablets */
      @media (min-width: 481px) and (max-width: 767px) {
       
      }
      
      /* Tablets */
       @media (min-width: 768px) and (max-width: 959px) {
      
      }
         
      /* Desktop */
      @media (min-width: 960px) and (max-width: 1199px) {
         
      }
          
      /* Large Display */
      @media (min-width: 1200px) {
          
      }

      This is how to create a custom CSS compatible with Gantry 4...

      Simply create a file called "<TEMPLATENAME>-custom.css" and put this file in the CSS folder of the template (where <TEMPLATENAME> is the name of the template as seen in template manager e.g. rt_iridescent would be rt_iridescent-custom.css). GANTRY4 will automatically load this CSS file. If you wish, you can also have browser specific files by appending, for example, "-ie9" making the filename "<TEMPLATENAME>-custom-ie9.css"

      Regards, Mark.
    • Please search forums before posting. Please make sure your post includes the version of the CMS you are using and a link to the problem. Annotations on screenshots can also be helpful to explain problems/goals. Please use the "secure" tab for confidential information.

Time to create page: 0.095 seconds