How to load templates with theme variables?

Loops & Logic
#1

Hi, I am wondering how best to load L&L templates that set theme variables and are not directly rendered on the page, E.g. design elements and copy snippets. These templates must load before all other L&L templates. I assume the best place is inside the HTML <head> or is that too soon?

Potential solutions:

  • Load the template in the head with PHP
  • Use Elementor’s custom code feature. This can position the code in the head but I can’t see a way to make it process a L&L template.

I do have a working solution of simply positioning the templates at the top of the Elementor header but this seems a bit hacky.

Appreciate any recommendations you may have.

Thanks.

#2

Hey Phil, that’s an interesting idea. I think the most efficient way to achieve what you’re trying to do is probably to load the template with PHP.

If you were wanting to approach this fully within L&L, I think the way I’d do that would be to just have a little conditional that checks whether a certain variable already exists in any of the templates that require the variable. If the variable doesn’t exist, it runs the template that creates that variable. Something like this:

<If check="{Get local=some_variable}" not_exists>
  <Template id=12345 />
</If>

You could put this same bit of markup in multiple templates and since the conditional logic would only be true the first time one of the templates ran, it would have a minimal impact on the overall load time of your page.

Even more efficient than this would be if you know which template is going to be the first to load on your page and you can just run the template that sets the variables once without needing to use conditional logic to check whether the variable exists.

Regarding Elementor’s custom code feature, you’re right that L&L needs to be written inside a template and other code widgets like that one won’t know how to render L&L markup.

That’s my two cents, I’d be curious to find out what approach you end up taking!

1 Like
#3

Hey @benjamin, thanks for the info.

I should clarify that for my theme elements (titles, meta, buttons etc.) I am using the Template Variable, E.g.<Set template=page_title>, so they are not run until a page template calls on them. At least, that’s how I understand it from the docs.

I’m more focused on the structure than performance right now, but given how this particular variable behaves, I don’t think it’s having a big hit on performance yet.

I have another template called theme variables that sets some theme properties like button titles, E.g. <Set name="post_button_title">read more</Set>. These would run on every page load, but it’s a very small file.

This is just my novice attempt to create a simple design system using a DRY code approach as recommended in your docs here.

I imagine this could all be solved more tidily using Tangible Layouts, but I think that may involve creating an entire theme from scratch. :slight_smile:

image
image1038×855 53.5 KB