Question How can I achieve this look...

[melissaclouds]

Hi All,

I am trying to achieve the below layout on my page and can't figure out what I need to do (FYI this is a three part question).

1) Basically, I want my home page to feature my most recent articles with a picture & heading and have a clickable direct link to those articles. Any ideas on how I can do this?

2) I have created drop down menus along the top of the home page as i'd also like my articles to be categorized and able to be reached at any time by clicking the heading link (so, for example if my reader wants to find recipes they would click the link at the top of the page and this would take them to all of my recipes). My home page, however, will feature my most recent articles (on various different topics which will each be categorized).

3) I will be updating articles regularly so if you could please help me figure out what I need to do to allow the 'category' page to have 9 articles before the user has to click on 'page 2' for example?

 

[sms-design]

Some more information about version of

• wordpress
• elementor free/pro
• widget
• theme

Screenshot or site url may help people answer your questions.

 

[melissaclouds]

Thanks for your reply sms-design.

So, to make things complicated, i'm not actually live on wordpress yet. I used a Tyler Moore youtube video which pointed me in the direction of the WPJelly website. It creates a version of wordpress, but the site is primarily built through Elementor (free version). I am using the Sea theme. Because i'm not hosted, I won't be able to share my URL

I've included a link to the site I want to model my own site on is theglitterguide (I am not allowed to post links on this site yet)

Figured out last night how to make an image link to another page, which is giving the effect i'm after but I think there must be a better way to do it.

Thanks
Melissa

 

[sms-design]

Melissa

Never heard of WPJelly but it's a great starting point. And I like their approach to getting people on board with WP/Elementor.

You have started in the right direction with a design in mind, now time to step back. You like using Elementor so take the plunge and get the Pro version you will find things so much easier going forwards. Also pop over to FB and join the Elementor Community Support Group

WPJelly have a guide about setting up a hostgator account which for 12month plan is $6 once you have that install ElemP.

I know your spend some monies but it will save you loads of time struggling with trying to do it for free and you will get support.

Glitterguide is using a theme called Analogue if your looking to replicate that layout

Ferdykorpershoek has a some good Elementor video tutorials.

And if your looking for more inspiration more themes here

 

[melissaclouds]

Thank you so much, you've been a great help.

I'll get myself signed up with hostgator (that was always the plan, I just hoped to have my page built first) and get the pro version if it's going to make life much easier!

 

[sms-design]

Please bear in mind I've be doing this for 30yrs and learnt my trade coding in notepad when computers starting using 250kb floppy disks for storage and the www internet was really in it's infancy. Over the years I've built simple landing pages to complex site's that since launch back in 1997 a news site that is now 100,000's of pages. Google piped us to the post on launch by only 60 days.

That's frightening I've had a google account for 22 years OMG .

In today's web design world remember your chosen design should work mobile > tablet > desktop 85% of your users with be in mobile > tablet

I would suggest reading up on the benefits of using a child theme.

Using a child theme means that you are not editing core theme files which are historically overwritten on an update, it also means that you can fall back to the parent theme when things don't go right.

A child theme also allows using a functions files which sounds scary but added a simple function to rename all readmore buttons will save you masses of editing of pages.

So depending on how keen you are on web dev look into running a local dev server, if your on a mac you already have an apache web server, if your pc based look into Laragon.

Now you have a test base to test loads of stuff. One another thing google a plugin called "All In One Wordpress" and you will have a backup plugin for your live site and a plugin to move a dev site from local to live in a matter of minutes.

 

[melissaclouds]

That is impressive!

It's not my intention to become a developer - i'd rather leave that to you experts
My goal was to try and save some money building my own page, but now I have a decision to make on whether to purchase elementor pro for $49 or simply buy the theme for $59 and potentially get my site launched much quicker. To give the fisherman a fish or the tools... That is the question lol. I must admit I have felt accomplished each night working on my basic elementor page and learning how to do new things and see it come to life so would happily continue if I know I can get my end goal and replicate the Analogue theme myself!

 

[sms-design]

Does the theme come with Elementor? If not your are going to need that as well, but once you have ElemPro copying gliiterguide should be an easy job. Watch a couple of videos on using chrome developer tools

Then you will be able to see what font's glitterguide used

 

[melissaclouds]

Oh so i'll need to buy elementor pro and the theme? Thought I could use elementor to build it myself. Crikey! Thanks as always for your valuable guidance and help!

 

[sms-design]

You will only need the theme if you wanted a jump start on the design, that's why people buys themes. And frankly get themselves in to all sorts of issue because of the themes css structure.

But yes you can do it with Elementor Pro only. And really have a firm understanding of what you have designed. Depends if you have the desire to learn YouTube is your friend.

What is the subject matter for your website goal

 

[Koni Kodes]

Hi @melissaclouds Elementor is a page builder that helps take the themes and make them look the way you want. While Pro does cost a little money, it works with free themes too. For instance, I use the free Elementor Hello theme becuase it gives me more flexibility with designs.

Also, Elementor has a very strong following of devs who create add-ons. Unilimited Elements is great to create your own widgets.

So, this is a fairly inexpensive way to get started with your first WordPress site.

I would get a host first, because you will already have some things in place that can't do locally - such as SSL that you will need anyway - and if you need help, the community can see what your code looks like and provide assistance.

In answer to your original question, I think you want your page to pull in dynamic posts based on the post category. This is the other confusing side of WordPress. Bjorn at WP Begginer is the best in helping answer the question:

What Is the Difference Between Posts vs. Pages in WordPress?

Want to know the differences between pages and posts in WordPress? Read this guide to find out the key differences between WordPress posts and pages.

www.wpbeginner.com

YouTube is great for overwhelming information. And there are a lot affilite videos. So just take your time to weed through and find what you need. Ferdy, Bjorn and Ben Pines are the best to learn from. And if you want to make widgets, follow Amit Keren at Unlimited Elements.

I hope this information was helpful.

I'm looking forward to seeing what you create.