rharer Posted May 3 Share Posted May 3 Hello, I'm wondering if anyone has a solution to use small PNG images in line in text (in my case, to use as social links). See screenshot below: I'd love the Instagram and Twitter images to just live in the text box next to the word "HOME" and adapt as that text box does but I haven't found a solution yet. Also, I want to obviously make them links to my social sites. Any help is appreciated! Link to comment
tuanphan Posted May 6 Share Posted May 6 What is site url? We can check easier Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
rharer Posted May 8 Author Share Posted May 8 Hello, the site URL is https://flugelhorn-opossum-4ese.squarespace.com/ Here is my current text box (the instagram and twitter icons are images, in separate blocks), but ideally I'd like something to work in one block. I found one tutorial (https://insidethesquare.co/squarespace-tutorials/image-in-text) that was pretty straightforward, but resulted in poor sizing/scaling, and I couldn't correct it. I'm happy to use different images for Instagram/Twitter if needed, but wasn't sure if there was an easy fix. Thanks!! Link to comment
tuanphan Posted May 10 Share Posted May 10 Can you add Instagram + Twitter icons? We can use code to move it into text to make all same line Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
rharer Posted May 10 Author Share Posted May 10 Take a look at this test page here: https://flugelhorn-opossum-4ese.squarespace.com/tesssstttt It includes a block with my current workings of this. Link to comment
tuanphan Posted May 12 Share Posted May 12 On 5/10/2023 at 11:17 PM, rharer said: Take a look at this test page here: https://flugelhorn-opossum-4ese.squarespace.com/tesssstttt It includes a block with my current workings of this. I see you figured it out? All same line here Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
rharer Posted May 12 Author Share Posted May 12 That’s the best I was able to do, however, even when I reduce the size of the image, it still appears at this size (too big, so the bottom is cut off in line with the text). Link to comment
tuanphan Posted May 14 Share Posted May 14 On 5/12/2023 at 8:57 PM, rharer said: That’s the best I was able to do, however, even when I reduce the size of the image, it still appears at this size (too big, so the bottom is cut off in line with the text). Can you keep images? We can give code to make images always fullsize Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
rharer Posted May 14 Author Share Posted May 14 Can you clarify what you mean by “keep images”? Link to comment
rharer Posted May 15 Author Share Posted May 15 Ah, I think I see: I had broken the image CSS I had in there so the icons were gone for a moment. They're back now! Link to comment
Solution tuanphan Posted May 19 Solution Share Posted May 19 On 5/16/2023 at 12:09 AM, rharer said: Ah, I think I see: I had broken the image CSS I had in there so the icons were gone for a moment. They're back now! Add to Design > Custom CSS .image1, .image2 { background-size: contain !important; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment