Site-wide Application

Is there a way to apply a change made to a common element on one page to all the other pages in the site (e.g., navbar, footer or contact info addition or link change)?

Use includes for all your common content and then you only have to change one file.

Hi Randy,
Yes of course it is possible as unlike other front-end only tools out there, Wappler supports server-side includes. We are putting this in our official documentation this week, but it is really easy to do, so here are a couple of screenshots:

  1. Select the component you want to re-use:

  2. Click the move to include button

  3. Save it as a separate file:

  4. Then on any other page, you want to include it, just click the add button and select Server Side Include:

  5. And select the include file you created from the properties:

That’s all - now whenever you open and edit the include file, it will update all the pages containing it.

will this work for html files for when building an app to be run thru cordova?

The included Framework7 has its own way of dynamic includes that works similarly.

Wappler handles them nicely by rendering the partial view files as well.

Check the included mobile template called Framework7 kitchen sink - it has all the views and even routing

And remember Crtl+click in design view performs a normal browser click so it is very useful to see the app fully operational in design view

Sorry I didn’t make myself clearer… I meant a way to find something and change that something sitewide. I just installed v1.1.0 and noticed under the magnifying glass on the left EXACTLY what I was looking for (see attached). Was that available in v1.0.3? If so, I surely missed locating it.

BTW - I played a bit with v.1.1.0 and WOW! is it ever SNAPPY - haven’t been able to crash it going between Design and Code views. The CSS editor behaves better now too. NICE WORK guys.


Hi Randy,
Find and Replace has been around for the past few versions actually.

Great to see you’ve found it :slight_smile:

Anyway - take a look at the server side include options, so that you don’t have to search & replace things like that for navigations, headers or footers.