[Support request] Which child theme will be best to create such a website/webpage?

[thenewbie]

Hello Guys.
I am trying to create a website like this:
https://www.dropbox.com/s/9nz8qo3stkgg1u6/sample.png?dl=0

Which GP theme would be perfect for this type of site?
Thanks.

GeneratePress 2.2.2

GP Premium 1.7.8

[Tom]

Hi there,

Marketer might be worth looking at.

As for the box with the red square around it, you would likely need some HTML/custom CSS.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[thenewbie]

Thank you so much Tom for looking into this. I am new to this but I know I can handle other things on the site, but I have no clue how to create that box in Red. Could you please help me with that?

[Joan]

You should maybe have a look at Elementor, which works really well with GeneratePress.

I don’t think you could set it up like that with the free version of Elementor, but with the pro version you could create a content box with an included timer, and style it the same or very similar.

Then for the coupon code, it could be just an image, and when clicked have it do a pop up with the code (there may also be a way to do a “content reveal” that wouldn’t require a pop up).

You would then save the whole content box as a template so you could insert it easily into as many posts as you want, and then just change out the coupon code and timer for each offer.

Anyway, just an idea. 🙂

[Tom]

A page builder like Elementor is definitely a solution for something like this.

The actual HTML/CSS for the box is quite easy – we can help with that. However, the countdown timer is a little more complex, and would likely require a plugin/javascript library.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[thenewbie]

Thank you Joan for the idea. I am open to using Elementor Pro but will it make the page heavy? The main reason for me to choose GP is that its lightweight and fast. Will that be a problem?

[thenewbie]

Hi Tom, I think I can skip the timer. Even on the original page, the timer works only on the desktop version, on the mobile version of the site the timer doesn’t even show. I am planning to make the page as lightweight as possible. Very fewer images and plugins, if we could use light CSS that would be a plus. Most of the page will be only texts, a couple of small images and this box, the box is the main part. If you could help me with the box, that’d be really awesome.

[David]

Hi there,

how is that content within the red box being added? Do you have a link that we can see with your content in place?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[thenewbie]

Hi David. I am sharing the url here:
https://www.dropbox.com/s/tnkn5j6z3aijbga/url.txt?dl=0

[Joan]

Yes, I understand your concern and I purchased GP for the same reason.

Elementor is unique among other page builders in that it doesn’t load anything on pages that it isn’t used on.

The main thing you don’t want to use with Elementor is Font Awesome, which loads its script on every page of your site if you use it even once.

Other than that I’m really surprised how lightweight Elementor is. I’ve been testing my site with both GP and Elementor and it doesn’t add much weight to any page.

I’ve been getting some great speed results, but I have a good hosting setup also – Kinsta + Autoptimize + CriticalCSS + Sucuri.

But you must be careful not to go overboard with adding elements to any page with Elementor. I’ll be using it sparingly myself.

If you can do without the timer, however, then you don’t really need Elementor.

Best wishes 🙂

[Tom]

Have you added the content for the box to your website yet? If you have the content added to your website, we should be able to add some HTML and CSS to style it if you choose to go that route 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts