Archived topic
Radically changing my home page; a bit lost on how to best get started.
3 replies · Started by Matt on April 15, 2021
Hey there,
I'm looking to making some fairly radical changes to my homepage (and eventually, Posts and Pages, as well). But I'd like to think things out properly beforehand. The most notable one is that I'm basically getting rid of the background (featured) image, and instead trying to create everything with divs and blocks.
(I'll likely be purchasing GenerateBlocks Pro, too).
My question is: what course of action would you take if you were trying to go from my current layout to my desired one? I'd prefer not to change my template (from Mellow to something new) because that they impact my Posts/Pages, too, which I'm not quite ready to take on -- I'd rather focus on home page, for now...? unless you think the best course of action would be to use a staging site and choose a different layout from the get-go?
Also, two side questions:
1, you'll notice how I have some elements here (the emojis, specifically) overlaying on two different div elements. How would I go about creating that?
2, in the header (on mobile) you'll see I am attempting to have parts of the h1 sticky, while the stack of words sort of "scrolls through" when on mobile, until it's gone through them. What technique would I Google to learn more about how to do this? And could something similar be achieved on desktop?
Thanks so much, as always.
Matt
Hi Matt,
You can build the new home page with Generateblocks and wp show posts which allows you to create a posts list and insert it to a static page.
For the other 2 questions:
1. How to locate the icon between two different blocks: you can give the icon and the block below the icon a negative margin to bring them up.
2. It can be done both on mobile and desktop with Genrateblocks and a bit CSS. Basically you create a container, in this container you create some Headline block and a Grid block to contain the sticky text, under the Grid, add another container to contain the scrolling text. You'll give it a negative margin to make it horizontally align with the sticky text in the first place. Once you've done that, you can open a new topic and we can try to provide a CSS solution to make the text sticky. You could google position: sticky CSSto learn about this property.
Let me know :)
Super, thanks so much, Ying. :) I'll reach back out with any questions, once I've made enough progress. Have a good one!
No problem :)
Glad to help!
