-
sparky
Hi
It’s been a while since set up a website and Generate Blocks is considerably different to what I used last time and I’m having trouble with a few things.
When I view the website from the desktop computer and I select the mobile view the images all seen in alignment and are centered as I scroll down the screen. When I view it on an actual mobile phone the images on the “Gold Coasts most trusted snake relocation services” section are pushed to the left. It doesn’t seem to be an alignment or a padding problem. It’s almost like the photo isn’t a 100 percent the size or something. Can someone please tell me what is going on with it?
I would also like to know why when I view it on a desktop, the heading “Gold Coast’s most trusted snake relocation service” won’t go completely across the screen so I end up with half on the next line. I can’t see why.
Northern Gold Coast Snake Catcher
Any help appreciated. Thanks
-
Alvind
Hi there,
Regarding the image width on mobile, you need to set the image’s width to 100%. Since you’re currently using the core Image block, which does not support percentage-based units, you should use the GenerateBlocks Image block instead to gain access to this setting.
As for the heading issue – the Text block currently has its width set to 65%. Simply remove this value, and the heading will no longer break onto a new line.
-
sparky
Thanks Alvind.
I’ve fixed the heading and I removed the four images and replaced them with the image block that’s listed under Generate blocks. I have had a look on the mobile and they still seem to be sitting to the left and when I have a look at sizing it says it’s set at 100 percent for the width. Did I have the images correctly?
Thanks
-
Alvind
Looks like the image width is still set to auto. Here’s the correct width field that you need to set: https://cln.sh/XzdBGVtcYgDByHHKK0Qr
-
sparky
Thanks Alvind
Sorry there seems to be a lot more settings in there now and I’m finding it a lot harder.
-
Alvind
No problem 🙂
Yeah, the Version 2 blocks are a bit more advanced in terms of block settings, as they were rewritten to be more robust, allowing you to style every detail of the block layout. If you’re used to using Version 1, there will be a slight learning curve to get used to.
-
sparky
I now have another problem. I’m trying to add a new hero image so I opened up the Generate Blocks Patent library and selected Hero 2. I cannot see how to add an image to it.
I watched a video about how to create a new Hero but I can’t workout how to edit the one I just selected from Generate Blocks. I can see a new element has been created. Can someone please tell me how to add the background image to it.
Thanks
-
Alvind
Hi there,
Please refer to this screenshot: https://cln.sh/hyVG8HzpGXGwR3mFFLDS
-
sparky
Thank you!
-
Alvind
No problem!
-
sparky
Is there a way to shift the alignment on a mobile screen so that the hero image centers on the lizards eye in this image but remains as it is on a desktop? I have tried several suggestions on this forum but none of them seem to do what I want.
Northern Gold Coast Snake Catcher
Thanks
-
You can try setting the background position on mobile to
70% center. Adjust th70%to fit your design. -
sparky
Thanks Ying. That worked perfectly
-
sparky
I seem to have run into another problem with the footer. For some reason when I view it on a mobile phone it’s like it’s got a lot of padding on the left and right and all the words are one below another. The mobile phone is also really small. It could also be that I’m now displaying everything full width whereas before it was set up in columns.
Can you please tell me how I edit this?
Northern Gold Coast Snake Catcher
Thanks
-
Alvind
Edit the Footer Element, then switch to the mobile view. Select the first inner section that wraps the text, and set the left and right padding to 20px.
-
sparky
Thanks for that. That solved the problem with the text but I can’t workout how to make the phone number bigger. At the moment it’s really tiny. How do I fix that?
- You must be logged in to reply to this topic.