Geodesic Solutions Community Wiki

User Tools

Site Tools

You are here: Auction and Classified Software Support Home » Tutorials » Design - Advanced » Using Non-Geo Templates

Sidebar

tutorials:design_adv:using_non_geo_templates

This is an old revision of the document!

Table of Contents

Using Non-Geo Templates

This tutorial will walk you through the steps necessary for taking outside templates1), and turn them into a usable Geo template set that you can use on your site or even distribute for use on other Geo sites.

<tip c w>Warning: This is an advanced tutorial, involving making changes to template files.

Before attempting to follow the tips or instructions here, we highly recommend that you have a firm grasp of the basics.

Remember that problems caused by customizations (including custom templates) are not covered by Geo support, if support finds that something works with the "default" templates but not with customized templates, they will not be able to help further. Geo Support can try to help you with the how and where for editing templates, but they cannot make changes for you or try to troubleshoot problems related to customized templates. </tip>

What you Need

Skills

  • Knowledge of HTML and CSS. <
  • Familiar with Smarty Templates. <
  • Familiar with any other standards or "technology" utilized by the templates you wish to use. <
  • Not afraid to learn new things. ;-) <

Handy tools:

Converting Templates into Geo Template Set

This is not yet a complete list of what is needed, we will be adding to it over time as needed. If you find something you had to do let us know about it and if applicable, we may add it to the instructions.

  1. Make sure the templates you are about to convert, are not already a Geo template set. If the template folder has a main_page/ sub-folder, chances are it is already a Geo template set and you do not need to follow these instructions. If you need help using a 3rd party Geo template set, see Upload Template Set. <
  2. Create a new empty folder to work on converting the templates in. For the purposes of this tutorial, we will use my_templates as the folder name. <
  3. Create the following 2 sub-folders in my_templates: main_page/ and external/ <
  4. From the original templates, copy all template files into the my_templates/main_page/ folder. You can use sub-folders to organize the template files if you wish. <
  5. Anything that is not a template file, such as images, CSS files, JS files, or other media files, go in my_templates/external/ folder. If you already copied any such files into main_page/ folder, delete those now and put them into the external/ folder.
  6. Within the external/ folder, we recommend to organize it into sub-folders for each "media type", for instance place all images inside external/images/, all CSS files inside external/css/ , etc. This is not required, just recommended to make the template set a little easier to manage. The rest of this tutorial will assume that you have organized it this way.
  7. If templates you just put in main_page/ are not already Smarty Templates, you will need to escape Smarty parsing within the template files. That is, if you find any curly brackets { or } inside non-Smarty template files, you will need to escape them, either by surrounding text with {literal}..{/literal} or by replacing { with {ldelim} similar to HTML encoding2). See Escaping Smarty Parsing page for more info. <
  8. Make sure each template file ends in .tpl <
  9. In each template file, add {header_html} Smarty tag in the <head>…</head> section. This is a special Smarty tag used by the Geo software, that allows the system to place necessary “head” information into your pages so that some dynamic content within you Geo installation work properly.
  10. In each template file, add {body_html} Smarty tag in the <body>…</body> section, where you want the main part of the page to display. This is a special Smarty tag used by the Geo software, to put dynamic content specific for each page within the system.
  11. Upload the my_templates/ folder to your site, into the geo_templates/ folder3), and CHMOD 777 the folder and all sub-folders and files recursively so that the template files can be changed in the admin. <
  12. In the admin panel, go to Design > Template Sets and check the Admin Editing next to the template set you just uploaded (make sure it is the only one being edited, if in advanced mode), and save changes.
  13. In the admin panel, go to Design > Page Attachments and assign a template attachment for each page. If you know you are going to want to customize a template to be different for different pages, now is the time to create a copy of the main template, for use on the different pages.
  14. Take note of all the filenames for media files in your external/ folder. For each media file:
    1. In the admin panel, go to Design > Text Search and search for the filename. Click on the Template Contents tab to find all the places that reference that media file, within your templates.
    2. Look for the first found match for any template file, that references the file "directly" instead of by using the external Smarty tag. In other words, you are looking for first one where the match is not preceded by something like {external file=. Click the button to edit that template. <
    3. On the edit page, click on the <..> Source Code Editor tab if it is not already on that tab.
    4. In the template source code that is displayed in the editor, find where the file you searched for is being used, you will be replacing it with an "external" Smarty tag. To do this, highlight the entire URL for the file, and above the editor window, click on the blue tag icon to bring up the Insert a Tag tool. Within the tool, click the external tab. Then in the Select File drop-down, find the file you are replacing, and select it. Then click Insert External Tag button, and close the tool. Ensure that the URL got replaced by the external tag properly, then save the contents of the template file. <
    5. Repeat for any other places that the media file is referenced. <

<

  1. Make sure you repeat the above step for each media file. <
  2. In the admin, go to Design > Manager. Now edit any template file you want to add Geo modules or Addon Tags to, and in the edit window, use the Insert a Tag tool to insert modules, addon tags, or other dynamic Geo information. You may be replacing parts of the template with the Geo equivalent, or you may be adding new content, or inserting content into "blank" areas on the template, depending on how the templates are set up. <
  3. In your template set, create a new file external/css/theme_styles.css. Edit the file using the editor in the admin panel, and use the button to replace contents with default. This will copy the contents of the theme_styles.css file from the default template set, and apply a few changes to the top of the file that will make software updates much easier. <
  4. Repeat the step above, but for the following files:
    • external/css/primary_theme_styles.css <
    • external/css/secondary_theme_styles.css <

<

  1. In your templates, add the following line in the <head>…</head> section: 
    <link href="{external file='css/theme_styles.css'}" rel="stylesheet" type="text/css" />

    <

  2. Now activate your template set at Design > Template Sets by checking the box in the Active column for your template set. Make sure it is the only template set that is active (other than the default template set if in advanced mode). <
  3. View the "front side" and browse the site. You will most likely need to heavily modify the external/css/theme_styles.css file so that the look of dynamic page content, and dynamic module content, match the look of the rest of your templates. This is where the HTML and CSS knowledge we mentioned at the top of the page comes in. <
1)
For instance, generic-use templates you might find on a site that sells those type of things.
2)
Don't do both methods though! Pick one or the other.
3)
If you already have a template set named the same thing, be sure to re-name one template set or the other, don't overwrite your existing template set with this one!
tutorials/design_adv/using_non_geo_templates.1299871765.txt.gz · Last modified: 2014/09/25 16:55 (external edit)

Page Tools

Except where otherwise noted, content on this wiki is licensed under the following license: CC Attribution-Noncommercial-Share Alike 4.0 International
CC Attribution-Noncommercial-Share Alike 4.0 International Donate Powered by PHP Valid HTML5 Valid CSS Driven by DokuWiki