Joomla 3.9 + Gantry 5.4.31 mismatch layout issue on localhost

Question

I am trying to build a regional blog/magazine. The home page layout which came as almost default with Gantry is satisfying. I am using XAMPP on Ubuntu 18.04.3 and Joomla 3.9.13 and Gantry 5.4.31.

Issue no. 1

I have 4 columns in the home page which is fine, but when the 5 th article is shown through pagination - next, it takes 2 column width. Shouldn't it be 1/4 of the page as page layout is 4 columns ?

Issue no. 2

When I click on an article to read it, it works fine. But below the whole home page content is visible. Is there any way to fix it ?

You can see the front end layout issues in GIF 1 and back-end in pictures 1 and 2

GIF 1

Pic 1

Pic 2

Answer 1

In G5 template screen remove Joomla Articles Particle.

The main content area is named 'Page Content' and it displays the current menu item dynamic content, so 'article' or 'list of articles' (so called blog layout).

1. Your homepage should have menu item set to Article/Blog.
2. Remove Joomla Articles Particle because it works like Joomla module. It will be visible forever under outline. Depends on assignment tab.
3. Treat gantry particles AS modules in Joomla and don't place them until you don't know them.

The point here is that the entry point for dynamic content of components of Joomla is Page Content. The page content renders your "Menu Items".

Remove Joomla Articles Particle from gantry. I've never used that particle, but remember that there's only one place in Joomla for dynamic content. Any module/particle that tries to render pagination must be a component. (In theory, it might load data in async mode, but then it's just a module.)

Choose between page content or Joomla articles particle.

So for test purposes you may remove page content or Joomla articles, but you must not place Joomla articles in BASE OUTLINE.

The base outline is the most standard layout of your site, other layouts (outlines) are assigned via assignment tab. Usually base outline is cloned and inherited, then some parts of it are unlocked.

In order to make your your homepage gantry-like you must create another outline for homepage, remove page content, put Joomla articles instead and test.