ispconfig template engine

Discussion in 'Tips/Tricks/Mods' started by smartyscripts, May 31, 2019.

  1. smartyscripts

    smartyscripts Banned

    I was wondering if anybody knows what is the template engine ispconfig uses, because I am making a theme builder and I have a few problems just want to know if it's possible to edit some files that are not in the theme folder, and what are the consequences? I am good with smarty but no sure if there are some differences.

    screencapture-wkwebbuilder-local-wkdevtools-wkapp-ispconfig-builder-php-2019-05-24-07_55_22.jpg screencapture-wkwebbuilder-local-wkdevtools-wkapp-ispconfig-builder-php-2019-05-28-06_00_53.jpg screencapture-192-168-24-21-8080-index-php-2019-05-31-00_49_02.jpg screencapture-192-168-24-21-8080-index-php-2019-05-29-03_57_17.jpg
    Jesse Norell likes this.
  2. nhybgtvfr

    nhybgtvfr Well-Known Member HowtoForge Supporter

    sorry, can't answer your question. but I do like some of those themes.
    especially the button's/top bar on the purple one. can you set different background images on each tab?
    are you planning on making any of this publicly available? do they work on 3.1.13?
  3. smartyscripts

    smartyscripts Banned

    This is an ispconfig theme builder app, an yes it will be available in the next few weeks at this is a preview of the builder but you can change anything, and design it with your favorite colors, there are some big changes also a full responsive grid system, some features you can add background colors, gradients, patterns, textures, images, change the layout width and sidebars, font sizes, colors, shadows, progress bars, tabs, sidebar can be a normal menu or accordion, there are unlimited options to design.
    change the way every page looks, there is not need to know code, just play with the editors, and yes all themes work beautiful.
    the version I am working is the mos recent.
    ISPConfig 3.1.13p1 but I will also make an option to choose the most newest versions, and some old ones.

    Body designer and settings

    a preview of the main editor menu app preview.jpg

    A preview of the top nav designer editor.
    till likes this.
  4. till

    till Super Moderator Staff Member ISPConfig Developer

    Overriding template files should be possible like this:

    E.g. you want to override the file


    Then place your file in:


    But be aware that files like /usr/local/ispconfig/interface/web/sites/templates/database_edit.htm are version specific, that's why they are not in the themes folder by default. So you will have to provide a theme release for each ispconfig release then as using wrong form templates will cause malfunctions in ISPConfig. This does not mean that the template file is different in each version, it just might be as that's teh file that gets modified when we add new input fields etc.
    smartyscripts likes this.
  5. smartyscripts

    smartyscripts Banned

    Thank you till, I will make sure of that, just want to create a least 7 different versions and the newest ones, I wanted to do this from a long time ago but I spend the last few weeks in this and I almost done.
    webguyz and till like this.
  6. smartyscripts

    smartyscripts Banned

    An example how pushy was redesign, when pushy is open this is how it looks.

  7. smartyscripts

    smartyscripts Banned

    hi Good day til, today I copy the same file database_edit.htm to my theme directory theme/sites/database_edit.htm to make some testing, with not luck it shows the original tpl file not the one I copy, I made some changes to the new file but it does't show any changes, this is what I tried so far
    1.-restarted the server
    2.- close and restart my session
    3.- Changed to default theme and then ispconfig.png back to my theme
    4.- copy the file to theme/sites/templates/database_edit.htm
    I wonder If I need to make some other changes
  8. smartyscripts

    smartyscripts Banned

    Finally got it, it worked when I created the module folder inside templates:

    /usr/local/ispconfig/interface/web/themes/yourtheme/sites/database_edit.htm -> din't work
    /usr/local/ispconfig/interface/web/themes/yourtheme/templates/sites/database_edit.htm this worked.
  9. till

    till Super Moderator Staff Member ISPConfig Developer

    Sorry for posting a wrong path in the example, I just looked that up in the template lib.
    smartyscripts likes this.
  10. smartyscripts

    smartyscripts Banned

    thank you I Just got a little lost, without touching ispconfig.js I implemented history.pushState , redesign the media queries, and adapted jquery detach to toogle the main search box to pushy and back to the main page,
    I added a new module for displaying website thumbs and almost done , just wanted to know i there is a var available for the word websites, so it can be displayed in all languages

    it posible to change this
    <img src="<?php echo $_SESSION['s']['theme']; ?>/media/{tmpl_var name='domain'}.jpg">
    to this
    <img src="<tmpl_var name='current_theme'>/media/{tmpl_var name='domain'}.jpg">
    to be displayed from the main ajax call in the main home page, because I just doesn't work, How can I make current_theme var available?
    and last can a share few themes in here?

  11. till

    till Super Moderator Staff Member ISPConfig Developer

    Set the theme to the new one in /usr/local/ispconfig/interface/lib/, then log out, close the browser to ensure the session si definately closed and open ispconfig again, the variable should contain your new theme now.

    Sure, it would be great if you share some theme here. I can also add a subpage for themes on and add the theme that you posted here on too.
  12. smartyscripts

    smartyscripts Banned

    That will be great til.
    yes I will post 20 different themes in the next few days I will try to post a least 5 every day.
    OptimBro and till like this.
  13. OptimBro

    OptimBro Member

    Nice work @smartyscripts

    I would love to test your themes. :)


  14. OptimBro

    OptimBro Member

    How can I contribute ? Can I share design templates in PNGs so that you can work on coding part?

    I have some design ideas in my mind, like clean design, flat design for more professional look.

    smartyscripts likes this.
  15. smartyscripts

    smartyscripts Banned

    OptimBro likes this.
  16. RogerMarley

    RogerMarley New Member

Share This Page