Building Page Advice

Support
#1

Hi,

I’m working on a dental website and I need to create a page for each service, i.e. root canal, veneers, etc. All pages will have the same layout and same elements with the content being the only thing that’s different.

Ideally, I would like to develop an approach where I can make edits in one place and have it update across all pages. Any advice on best strategy?

My current knowledge says that I should do the following:

  • For page layout, create a ‘Single’ template with necessary elements and use that for all pages
  • For heading element, use dynamic content so each page gets its own heading
  • For content element, how to populate this so every page has its own content but can be managed centrally? Is there a way to use JSON as the source for text content and if so, how to populate each page with it’s own content?

Any help/direction would be appreciated!

Thank you

#2

Hello @kgpthemex,

Thank you for the inquiry.

You are right about using a single layout. For the content, you can use dynamic content and, if necessary, supercharge it with Advanced Custom Fields. You’ll find more info about all of this in the following documentation.

Single Layout: https://theme.co/docs/single-templates
Dynamic Content: https://theme.co/docs/dynamic-content
ACF Looper: https://theme.co/docs/acf-pro-and-loopers
Loopers: https://theme.co/docs/loopers

Let us know if you need more info.

Best regards,
Ismael

#3

@Ismael,

Thank you for the quick response. I’m happy to give ACF a shot but I was hoping I could do this natively if possible. For instance, if I use a looper/consumer on an element and use JSON as the source, is it possible to use a dynamic content tag to load specific data from the JSON file for each page?

This would be ideal as I would not have to depend on ACF or an external method.

Thanks again.

#4

Hello @kgpthemex,

Yes, you can use Looper Provider JSON on each of the pages. The problem though is that sooner or later it will become complicated. How would you connect the Looper Provider JSON to the pages? Be advised that a page has its own URL and other page meta. ANy of these might not be available with what you have in mind.

Screenshot 2025-01-18 at 1.18.29 PM
Screenshot 2025-01-18 at 1.18.29 PM1664×1168 136 KB

The point of having a Pages section in WordPress is to have separate and independent content pages with information that does not change or might be updated once in a while. With pages, do not need any Loopers to load the page content.

Did you know that even with using Pages, you can still have one single layout if you have created a custom single layout and assigned it to all of your pages?

Single Layout: My custom page

Pages:
- Service page A: uses My custom page layout
- Service page B: uses My custom page layout
- Service page C: uses My custom page layout
- Service page D: uses My custom page layout
- About Us: uses default layout

The only drawback is that you will have to edit each of the pages when you have some additional information.

Hope this helps.

#5

@ruenel,

Thank you for your input. Your question below is precisely why I came to here get help.

As you said, and as I mentioned earlier, using a “Single” layout and applying it to all pages will allow me to make changes to one template so all pages can be updated at once :white_check_mark:.

But as far as unique content for each page is concerned, this is what I was thinking:

  1. Add content element inside ‘Single’ layout.
  2. Enable looper for content container and add JSON content
  3. Enable consumer for content element
  4. Load content selectively from JSON data based on current page???

Would it be possible to use the slug of the page to reference the content to be loaded? It seems straightforward enough but is something like this supported? Sorry I’m still learning about dynamic content and advanced features!

Thoughts?

    [
      {
        "slug": "Braces",
        "content": "Braces Content"
      },
      {
        "slug": "Infection",
        "content": "Infection Content"
      }
      {
        "slug": "Cleaning",
        "content": "Cleaning Content"
      }
    ]
#6

Hello @kgpthemex,

If I am gonna do that, my JSON would something be like this:

[
      {
        "pid": 123,
        "slug": "Braces",
        "title": "Braces Content",
        "content": "Maecenas a tincidunt ipsum. Vestibulum vel orci non justo tristique volutpat. Curabitur pellentesque, orci quis imperdiet sodales, nisl lacus pharetra mauris, porttitor pellentesque purus libero at enim. Proin fringilla, risus sit amet lacinia accumsan, est velit rutrum libero, eu bibendum nisl ligula sed diam. Aenean egestas eu augue et feugiat. Curabitur rutrum orci ut semper gravida. Nunc hendrerit erat et enim porttitor, dictum ultrices ligula aliquam. Curabitur auctor facilisis pretium. Donec eu quam leo. Nullam quis ante faucibus, semper odio sit amet, venenatis tellus." 
      },
      {
        "pid": 456,
        "slug": "Infection",
        "title": "Infection Content",
        "content": "Duis lorem leo, bibendum interdum quam et, dictum tristique velit. Aenean suscipit nec diam eget porttitor. Vivamus odio ante, vehicula quis semper sed, feugiat sed tellus. Maecenas aliquet euismod ante, ac lobortis quam varius finibus. Aliquam molestie gravida sem eget commodo. Morbi suscipit leo ut mi finibus posuere. Proin vel feugiat tellus, at varius nulla. Cras eleifend malesuada ex, sit amet tristique velit pharetra nec. Curabitur sit amet imperdiet turpis, et vestibulum nunc. Nam urna sapien, tincidunt sit amet tempus rutrum, dignissim et quam. Fusce laoreet vehicula malesuada."
      }
      {
        "pid": 789,
        "slug": "Cleaning",
        "title": "Cleaning Content",
        "content": "Curabitur in nulla consectetur odio condimentum iaculis. Fusce elementum nulla vitae felis porttitor, in bibendum sem tincidunt. Nulla a libero a odio finibus lacinia id ut nulla. Vestibulum fermentum facilisis semper. Nunc sem justo, facilisis vel mi vel, facilisis maximus eros. Sed sit amet sodales dui, et suscipit orci. Curabitur laoreet lectus libero, eget euismod augue gravida a."
      }
    ]

I can use the page’s slug and ID to match it with what I have in the JSON above.

Hope this makes sense.

#7

Thanks for the sample @ruenel,

I guess we understand each other. So the question is, how do I call this data to display on respective page?

#8

Hello @kgpthemex,

Well, you have to use Conditions. When the page ID matches the pid, the title and the content will be displayed. The rest of the loop items will be ignored.

Cheers.

#9

@ruenel,

Are you referring to the conditions under the customize tab for each element? If so, I thought that those conditions were meant to be used hide/show the entire element? Sorry I have never known about using conditions to selectively show content for an element using JSON data. Any document on this? Guidance please!

#10

Hello @kgpthemex,

Yes, the “Conditions and Assignments” that is under the Customize tab of each element. Take this element structure for example:

Section 
   Row - Looper Provider JSON 
      Column - Looper Consumer
           Heading -  {{dc:looper:field key="title"}} [CONDITION: {{dc:looper:field key="content"}} is equal to {{dc:post:id}}]
           Text element -  {{dc:looper:field key="content"}} [CONDITION: {{dc:looper:field key="content"}} is equal to {{dc:post:id}}]

Based on the above, you can modify it and include your place holder text when viewing the page that is not part of the JSON or when the page is not yet created yet it already exist in the JSON.

Kindly let us know if this helps.