how can i create a Grid Page
-
Hello,
I have been trying to create a grid page on my website but I can’t seem to figure out how.
I am currently using the free Motif Theme, which comes with the grid page options, which is why i selected that theme activated it.I want to create a page in the ABOUT US menu on my website that users can click on, and it will take them to a new page showing all 6 members of my team.
I followed the instructions, yet it still did not work.
Has any one else had issues with creating a grid page.—Here are the instructions that I have been trying to follow
The grid page template is ideal for showcasing your products, presenting your team members, or displaying your portfolio items. Once you assign this page template to a page, you’ll need to create and publish sub-pages (or child pages) for the grid to appear. The featured image, the title, and an excerpt from each sub-page creates a grid item.
The blog I need help with is: (visible only to logged in users)
-
my steps:
(1) use a theme that has a ‘grid page’ template (i’m using Motif)
(2) create main page (my main page is ‘ABOUT US’)
(3) Set ‘ABOUT US’ page as “parent page” and select “grid page” template
(4) create ‘child pages’ (I created 2 child pages “our team”, “our advisors”)
Now this is where I am having trouble…
I have 4 advisors and 6 team members. I want to be able to click on the “our advisors” page and have all 4 advisors show up on the same page (as a grid). Same thing for the “our team” page, I want to click on the page and have all 6 team members appear on the same page.Does anyone know how to do that? Please help!
Thanks -
Hi, your site is marked Private. You can either answer the request that was sent to your email in order to allow me to take a look at the front end, or, change the site’s visibility from Settings -> General -> Privacy.
As for the grid, when you go to the editor for ABOUT US, did you set the page template to the grid page template? It should be in the right-hand sidebar under page attributes. See here: https://cloudup.com/cgfiLpQSP9S
Once you set the ABOUT US page to the grid template, click save and then create a new page. For each new page we will go to the sidebar in the editor and nest the page as a child, or subpage, of the ABOUT US page, see here: https://cloudup.com/ch3kJl8XlTC
Every subpage of the ABOUT US grid template page will show up as a gridded item on the ABOUT US.
See how that goes and tell me if you run into any problems!
-
@jjchrisdiehl
Note that Staff do provide support in the CSS Customization Forum automatically and they can access private sites, unlike us Volunteers. -
Hi again, I misunderstood your question! You can create two pages, one called Advisors and one called Team. And then create a grid for each one. But I do not think you can have both grids on the same page. You could make a page and have perhaps two images on it, one for the Advisors and one for the Team, then link these images to the separate pages.
-
Hi @jjchrisdiehl, thank you for your quick response.
I added you as a user on my website.
The method i used is exactly like what you said. I created the ABOUT US and under the page attribute, i selected the ‘grid page’ template.
I then created 2 sub-pages/child pages (‘advisors’ & ‘consultants’) which i put under the ‘About Us’ page.
p.s: consultants was originally named “our team” (see my earlier posts).
I haven’t created anymore pages.What i want to do is to create a grid page under “advisors” and “consultants” so that I can list the members (4 advisors and 6 consultants). I do not necessarily want create 4 and 6 new pages (like a page for each member).
I just want somewhere I can put their name, pictures, and short description.Also, is there any way i can change the nested page format.
like for example, let say i have a main page called HOUSE, then under that i have PEOPLE, and further under that i have FAMILY and under that i have SIBLINGS and under that I have BROTHERS, and so on and so on (you see where I am going with this…)
whenever I click on one it shows me page, it shows me the other, and i click on the subpage, it shows the next sub-sub-page and so forth..I end up having a bunch of sub-sub-sub-tabs before I can actually get to the page I want -> that’s kind of inconvenient.
I want to create only 1 sub-menu, and the user can click on that submenu and it will take them directly to a new page where they can see all the options.
like this
click on HOUSE and it shows the sub-menu PEOPLE
click on PEOPLE, and it takes me directly to a new page FAMILY (maybe FAMILY can be a “grid-page”, which lists: SIBLINGS, PARENTS, etc). so it will stop at FAMILY and take me to that page directly instead of pointing to the next sub-page and so on.
In other words i dont want to have a bunch of arrow
HOUSE > PEOPLE > FAMILY > SIBLINGS > etc.I don’t know if it’s my theme, or if there is any way to customize/remove nested pages.
Let me know, thanks -
My comment at https://en.forums.wordpress.com/topic/how-can-i-create-a-grid-page?replies=6#post-3005911 was overlooked it seems.
Your site is private so Volunteers cannot view it, and we Volunteers never ever request to become users of sites to help those who post here.
I will type modlook into the sidebar tags on this thread for a Staff follow-up. How do I get a Moderator/Staff reply for my question? https://en.support.wordpress.com/getting-help-in-the-forums/#how-do-i-get-a-moderatorstaff-reply-for-my-question Also subscribe to this thread so you are notified when they respond and be patient while waiting. To subscribe look in the sidebar of this thread, find the subscribe to topics link and click it.
-
@timethief
Sorry i forgot to respond to your comment.
I can definitely make my site public since i will most likely need more help in the future.
But the site is still under construction and that’s why i didn’t want to make it public just yet.
Thanks for sending the link for the support page, will go ahead and subscribe to that.
Thanks :)
***************@jjchrisdiehl
I followed you method, and it worked, i was able to create the grid page. the one thing i was doing wrong (or not doing in this case) is that I wasn’t specifying that i wanted the names to be under the ‘about us’ section. lets say i had a child page for a member named Dan, when i get to the right-hand panel, i didn’t select the ‘about us’ as its parent page. So i did that for all the members, and now it works.Thank you!
***************I am still trying to figure the ‘nested pages’ issue, let me know if you can help with that.
-
Hi @admittedgrads :) Good work on the grid page! If you add a featured image to each of those child pages you can get the advisors faces to show up, too.
About nested pages, you can actually nest them by making each sub-page a grid page, and so on. Or do you mean you want to nest the menus?
If you’re hoping to nest the menus, is doable. This page has a video that shows how that works: http://en.support.wordpress.com/menus/
Just bear in mind that too many nests can be a bad user experience if someone loses their place. Hope that helps!
-
-
@supernovia, thank you for the help.
Yeah the grid is working now so i’m happy with it. I did try and add an image, and the image displayed just fine.
I think What I want to do is create a profile for the advisors, and just another page.
for example this is the format i want to use
–when the user clicks on the the ‘advisors’ page, all 4 advisors show up on the same page. (which is the grid page that i already achieve, so that’s all good so far)
–now with all 4 advisors i want to have their info displayed on the same page, as follow:
picture on top, name under the picture, and short description under their name. see this website here as an example of what i’m taking about (https://www.wcstrategists.com/our-team.html)
*****
As for the nested page, you’re right, what i meant to say is ‘nested menu’
my issue is this i dont like too many nested pages. i agree with you that it can be a bad user experience.
so like i said in my earlier post, i dont want to be taken to a gazillion nested pages until i can finally get to the page i want.right now the way my website is, it does this
SERVICES
MEDICAL SCHOOL
GRADUATE SCHOOL
Ph.D.
MASTERS
M.B.A
MPH
so you what i mean…so if i wanted to go to MPH, i would be taken to 4 sub-sub-sub-menu until i can click on the MPH page.
What i want is this i want my menu to only show 1 sub-menu (and no-more) even though there are other sub-menus further down. I want the next sub-menu options to show on the actual page.
like this…
SERVICES
MEDICAL SCHOOL
GRADUATE SCHOOL
then i can click one of the option, let’s say i choose ‘graduate school’
and click on it.
then i should see on a new page (the graduate school page)
GRADUATE SCHOOL
Ph.D. MASTERS OPTION 3 OPTION 4that last part where they are all listed together is the grid option, and i already know how to do that. that won’t be a problem.
it is getting rid (or changing) of all the A > B > C > D > etc that is the issueSorry my posts are so long, I just want to give as much detailed as possible to illustrate my issue.
Thanks again everyone!
-
The formatting in my post was lost after I submitted it, so you can access it here with the formatting, it’ll clarify what i said above
-
Hi @admittedgrads, I would either use a menu widget in the sidebar or the https://en.support.wordpress.com/list-pages-shortcode/.
For the advisors pages, I believe if you’ll add a featured image (their portrait) and an excerpt to each person, they’ll show up somewhat like that on your grid page, since that’s how it works in your theme’s demo. Want to try it?
-
@supernovia
I added the images and short description and it worked.
Thank you for the help!!
—
As for the nested pages (page hierarchy) i’m still having trouble with it.
The problem is actually with the depth of pages that appears.I only want the depth to be 1 (i.e: 1 main page shows up, then when you move the mouse cursor over it [without actually clicking on it] it shows all the child pages. and STOP) if you hover over any of the child pages, it should NOT show anything. in order to see the other sub-sub-pages (grand-child pages at this point), that’s when you would need to actually click on the child page.
I followed the instructions from the “list pages shortcode” link that you sent me.
***********
depth: this parameter controls how many levels in the hierarchy of pages are to be included. The default is 0 (display all pages, including all sub-pages).0 – Displays pages at any depth and arranges them hierarchically in nested lists (Default).
-1 – Displays pages at any depth and arranges them in a single, flat list.
1 – Displays top-level Pages only.
2, 3 … – Displays Pages to the given depth.
I did the following
********(1) first, i set my parent page ‘about us’ to (“0”-default) so i can see all child pages
(2) i set the child-page ‘advisors’ to “1” because i dont want to see any of its child pages.
but it still appears.I’m gonna try the widget option and see if that works.
I’ll let you know.Thank you!
-
Bear in mind the menu is totally different from your page hierarchy. You can put whatever links you want in a menu or not have a menu at all.
The child pages shortcode, on a page, would list only the “children” of the current page.
For the sidebar widget menus, you would create a new custom menu first, then add it to a widget.
-
I think maybe i’m just unclear on what a widget actually is.
I created a custom menu, using the link that you sent me, but i don’t know what is the difference between ‘custom menu’ and ‘widget’.
On the list of widget there are many options to choose from, but i am not sure which one actually is the right one for what i am trying to accomplish here.
Sorry i’m totally new at this. -
I tried the widget, but i think i kind of understand how it works. I don’t want to add a sidebar.
(1) If you go to my website, you will see that under ‘services’ i created 5 children pages
(2) if you move your cursor over the ‘graduate school’ child page, you will see 3 more children pages.
and that’s the issue.Is there a way to make sure that nothing appears when you move your cursor over the ‘graduate school’ child page?
even though technically those 3 pages are there, but you won’t be able to see them jus by moving your mouse cursor over it.
In other words, the user would need to click on the ‘graduate school’ page first, which would open a new page where those three child pages will finally appear. -
the way i created my child pages is by dragging each sub-page to the right a little bit, so that it is indented. each indented page represent a sub-page.
page 1
……..child page A
……..child page B
……………………….grand-child page X (which is a child of page B)
……………………….grand-child page Y (same as X)
My goal is that I want to hide grand-child pages.
I dont want them to show just. i want people to have to actually click on the parent page first. Like only page A and B will show by moving the cursor over page 1. but in order to see pax X and Y, you need to click on page B which in turn will direct you to a new page. -
@admittedgrads to clarify, this is the service page:
https://admittedgrads.wordpress.com/services/This is a grid page:
https://motifdemo.wordpress.com/page-templates/grid-page/Is that what you’re hoping to achieve, or are you talking only about menu items, which are links, not pages?
-
If you only want to remove menu items, you can delete them under Customize > Menus. Find the affected menu and remove the links you don’t want.
That will only remove links to the pages, not the pages themselves.
- The topic ‘how can i create a Grid Page’ is closed to new replies.