Image setup for Homepage

  • Unknown's avatar
    ozgaloreau · Member ·

    Hi,
    I am trying to put images in tiles for my homepage but then I can’t resize titles to cater for the size of image. I am also unable to add links to titled images.
    When I tried to add these images in sets of 2 column, I can’t resize the columns to cater for the image size.
    I need help and here is my website as a reference: https://ozgalore.au
    Thank you.

    WP.com: Yes
    Jetpack: Yes
    Correct account: Yes

    The blog I need help with is: (visible only to logged in users)

  • Unknown's avatar
    ozgaloreau · Member ·

    The image logo is now linked to https://ozgalore.au/new-arrivals/ which works find, until the homepage is fixed. This is frustrating as there is no one online to help, no one answered my email and no one is here in this forum to help me resolve this issue.

    Any help would be highly appreciated.

    Thanks.

  • Unknown's avatar
    parkdanil · Member ·

    It can take a few days to get a response from Staff here due to the heavy traffic.

    I’ve seen some of the Premium Themes replicate what you have described with the titled image tiles, so there should be some way to make it work.

    I tried playing around with the editor to try to make something similar to what you need. I first applied a ‘Row’ block, and then inside the Row, I inserted a ‘Stack’ block.

    The Row block is a page element that lets you position blocks horizontally on the page. The Stack block works the same but vertically.

    I next added a ‘Paragraph’ block followed by an ‘Image’ block, with both of these blocks located inside the vertical Stack block. This placed the text in line with the image container. I was able to further match the two blocks (paragraph/image) by Grouping them and setting the ‘Align Text Center’ function.

    I’d strongly suggest having the List View tab open when you are doing this. It was really easy to misplace the blocks without this visual aid.

    You can use the Image Height and Width settings to individually get the pictures spaced properly with your Titles. If you use the Paragraph block it can be hyperlinked to a URL. The Image block can also be Hyperlinked.

    I hope this helps.

  • Unknown's avatar
    parkdanil · Member ·

    Here is a sample of what it might look like.

    My images are all different sizes, so it’s not a great example. I think maybe 3 stacks per row would fit best with text and images. You can definitely play around with it though.

  • Unknown's avatar
    ozgaloreau · Member ·

    Thanks heaps. Upon an instant testing, it does work so I will work around it to get it look nicer. You are a life saver, much appreciated.

  • Unknown's avatar
    ozgaloreau · Member ·

    Now that I have achieved putting two photos side by side using row, I have tried time and time again to resize the photos to 700 wide, 580 tall, but I couldn’t. I even inserted a header which is shrinked down. My pages are limited to width and I don’t know how to widen the actual page.

    This actually applies to all my pages, example is here: Body Care

    Any help is much appreciated.

  • Unknown's avatar
    ozgaloreau · Member ·

    Just an update that I have achieved to resize the images by widening the page width through CSS coding:

    .container { width: 100%; max-width: none; }

    However, my images look split into halves on mobile view.

    I am also unable to apply margins to the sides of the page.

  • Unknown's avatar
    ozgaloreau · Member ·

    Even my products appear double on mobile : New Arrivals

    This is getting frustrating, no one replies to my emails, no one is available in live chat and there is hardly anyone here in the forum to help.

  • Unknown's avatar
    ozgaloreau · Member ·

    I just changed the theme in hope that it works, but it didn’t. At least  New Arrivals work find on mobile however Home Page still looks the same as of now.

    Even the documents on wordpress didn’t have anything useful to help.

  • Unknown's avatar
    parkdanil · Member ·

    I am glad you got the image sizes appropriate for the desktop experience. I wish I knew more about mobile and that I might offer some advice.

    I don’t like any of my sites when they are viewed from a mobile browser. I have often thought it would be nice to make a separate version of my site exclusively for a mobile experience.

  • Unknown's avatar
    ozgaloreau · Member ·

    You help is still much appreciated thus far.

  • staff-totoro · Staff ·

    Hi there @ozgaloreau I’m not sure that I’ve understood your issue since you have had a few different theme switches and may not be using the theme you mentioned in your previous post.

    You are trying to set up the homepage of your site? Or are you still having an issue with image sizes?

    Thanks for the additional info!

  • Unknown's avatar
    ozgaloreau · Member ·

    Hi,

    As explained above, I wanted to put 2 large photos in each row that continues into several rows of pictorial product categories, there was no one to help. Then I was told to put them into row and stack blocks, which worked perfectly however it would look split up in mobile view.

    I then thought maybe I should use elementor, which worked fine and rectified the issue but there are still issues with resizing page width, page content and the images on that page.

    Therefore, I had to try and use several themes to see which one looked better and more user-friendly. I am still working on it.

    I am thinking on designing a mobile exclusive design, but I have never done this before so I will have to learn how it is done.

    Thank you.

  • The topic ‘Image setup for Homepage’ is closed to new replies.