Ignite - Using images in category or product content field

DekselsDeksels Member Posts: 10

I've been using the Ignite theme for a while now. Mostly to my satisfaction. However, there's one thing that I just cannot get to work properly.

Whenever I add anything to the content field of either a product or a category, there's the option of inserting links or media. Embedded videos work fine, so do links. But a simple image is a big problem.

It seems to work fine, until you open the page on a mobile device, where the picture is completely stretched out. This doesn't happen to video links and it also doesn't happen to things like headlines, banners or product photos. Only images added to the content field. No matter what resolution or aspect ratio I use, the aspect ratio on my phone is completely out of whack and unusable.

Any help greatly appreciated. It's driving me mental.

1 comment

  • larry_nalzarolarry_nalzaro Member Posts: 32

    It's simple, you need to add this to custom.css, like so:


    img {
       width: unset;
       height: unset;
    }
    


    When you insert an image into the Content data field it inserts the underlying HTML code with width and height attributes. As an example, it will insert the image like so:

    <img src="https://cdn.shoplightspeed.com/shops/648343/files/43243312/zenith-hero-new.jpg" alt="" width="1920" height="600" />
    


    To negate those 2 attributes, you have to unset them through CSS.

Sign In or Register to comment.