[Support request] How to add Theme Templates

[Gerik]

Hello!

I’m building a real estate website using ihomefinder’s Optima Express. It has some pages that require full width (built through their system, not a page under Pages in WordPress) and some that need a container with no sidebar.

How do I make Templates? I tried using Elements but it requires me to pick a page/post which (Optima Express’ pages) are not on the list.

[Gerik]

I’m assuming I have to do it this way?

https://generatepress.com/forums/topic/how-to-create-page-templates-for-childrens-theme/

I found this after I posted it. Some of the links are broken but I can still find them on WordPress. Is there an alternative method?

[Tom]

Hi there,

Yes – this should help: https://developer.wordpress.org/themes/template-files-section/page-template-files/#creating-custom-page-templates-for-global-use

[Gerik]

Okay I know what needs to be done but I don’t know how to code.

I can copy the GeneratePress codes but that will not give me the size I need…

Do you recommend someone that can do it (not for free)?

1. Full-Width Template
2. Content Only max-width 1280px
3. Content plus Widget (75/25) max-width 1280px

[Tom]

If you want to set up those templates and then link me to a page using each of them, I can provide the CSS 🙂

[Gerik]

.com/full-width/
.com/content-only/
.com/content-plus-widget/

I uploaded the page PHP files with a different name. Created the pages and adjusted them to what I need through the page editor. Is that right?

[Tom]

Perfect.

So it looks like you have the full width template done.

Now for the other two – when you say content only, do you mean no header, no footer and no navigation?

[Gerik]

I think I didn’t follow your directions well.

I made the pages and edit it inside of WordPress which is useless to me because the file itself is not edited only that page.

I reverted everything to default. You may now look.

Full is edge to edge
Content only is 1280px width
Content with Right sidebar total with 1280px

[Tom]

Ok, so now I would do this:

Create three new Layout Elements: https://docs.generatepress.com/article/layout-element-overview/

For the first one, set the container to full width, and disable the sidebar.

For the second one, use Disable Elements to disable everything on the page except for the content.

For the third one, use Disable Elements to disable everything on the page, but keep the sidebar.

Leave the Display Rules empty for all three, but take note of each Element ID (the number in the URL).

Now you can do this:

add_filter( 'generate_layout_element_display', function( $display, $element_id ) {
    if ( 123 === $element_id && is_page_template( 'pagefull.php' ) ) {
        $display = true;
    }

    if ( 456 === $element_id && is_page_template( 'contentonly.php' ) ) {
        $display = true;
    }

    if ( 789 === $element_id && is_page_template( 'contentsb.php' ) ) {
        $display = true;
    }

    return $display;
}, 10, 2 );

Now just update the $element_id values with the correct IDs, and those Layout Elements should apply to your custom page templates.

[Gerik]

It’s been a while since I touched backend wordpress, I know I had a plugin that I can add these codes under plugins but I can’t remember what it was called. OR do I add that code somewhere else?

[Gerik]

Found it. Editing Functions.php in the theme folder.

[Gerik]

it didn’t work.

This is the page with the “full-width” template that I need to work: .com/homes-for-sale-search/

This is the page I create in WP (your instructions) and it works: .com/full-width/

Element ID 8949

[Gerik]

[Tom]

That code should be added using one of these methods: https://docs.generatepress.com/article/adding-php/

homes-for-sale-search doesn’t seem to be using any custom page template according to its body classes.

[Gerik]

I added the code to the functions.php

It does nothing to this page .com/homes-for-sale-search/

I know I did the code correctly because this works .com/full-width/

Element ID 8949

[Author]

Posts