User Tools

Site Tools


creating_and_adding_custom_pages

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
creating_and_adding_custom_pages [2017/02/16 06:00]
admin [2. Creating a page with a left menu.]
creating_and_adding_custom_pages [2017/02/16 12:08] (current)
admin [2. Creating a page with a left menu column.]
Line 1: Line 1:
 ====== Creating and Adding Custom Pages ====== ====== Creating and Adding Custom Pages ======
  
-This tutorial ​is about creating and adding custom pages to your Etano site. The tutorial covers 2 scenarios, creating a wide page with no left menu, and creating a page with a left menu.+This tutorial ​provides step by step instructions for creating and adding custom pages to your Etano site. The tutorial covers 2 scenarios, creating a full width page with no left menu column, and creating a page with a left menu column.
  
-===== 1. Creating a wide page with no left menu. =====+===== 1. Creating a full width page with no left menu column. =====
  
-You'll need to create ​three files, ​PHP file, an HTML file, and CSS file.+You'll need to create ​files, ​PHP file, HTML file, and CSS file.
  
 **The PHP file** **The PHP file**
Line 39: Line 39:
 include '​frame.php';​ </​code>​ include '​frame.php';​ </​code>​
  
-$tpl->​set_file('​content','​**mypage.html**'​);​\\ ​+Then edit the info shown below in **BOLD**. 
 + 
 +$tpl->​set_file('​content','​**mypage**.html'​);​\\ ​
 $tpl->​process('​content','​content'​);​\\ $tpl->​process('​content','​content'​);​\\
  
Line 47: Line 49:
 $tplvars['​meta_diz'​]='​**your page description**';​\\ $tplvars['​meta_diz'​]='​**your page description**';​\\
 $tplvars['​page'​]='​**mypage**';​ \\ $tplvars['​page'​]='​**mypage**';​ \\
-$tplvars['​css'​]='​**mypage.css**'; //<- adds a link to CSS file//\\+$tplvars['​css'​]='​**mypage**.css'; //<- adds a link to CSS file//\\
 include '​frame.php';​ // <- wraps the html page with the header and footer// include '​frame.php';​ // <- wraps the html page with the header and footer//
  
-Then edit the info shown above in **BOLD**. 
  
 Save it as **mypage.php** (make sure to include the .php extension or else your file will be saved as a .txt file by default). The upload your new PHP file to the main root directory where the index.php file is located. Save it as **mypage.php** (make sure to include the .php extension or else your file will be saved as a .txt file by default). The upload your new PHP file to the main root directory where the index.php file is located.
Line 59: Line 60:
 **The HTML file** **The HTML file**
  
-This is very simple, open notepad or your favorite editor and leave it "​**BLANK**"​ and save it as mypage.html (make sure to include the .html extension or else your file will be saved as a .txt file by default).+This is very simple, open notepad or your favorite editor and leave it "​**BLANK**"​ and save it as **mypage.html** (make sure to include the .html extension or else your file will be saved as a .txt file by default).
  
-Then upload it to directory folder where the other HTML files reside, which is in the skins_site/​def/​ folder+Then upload it to the directory folder where the other HTML files reside, which is in the skins_site/​def/​ folder
  
 Now you are ready to add your content to the "​mypage.html"​ file, which can be just standard text or you can include standard html tags and markup as well. **Note:** you only need to add your page content, all the header and footer HTML is included by the frame file. Now you are ready to add your content to the "​mypage.html"​ file, which can be just standard text or you can include standard html tags and markup as well. **Note:** you only need to add your page content, all the header and footer HTML is included by the frame file.
Line 70: Line 71:
 Open your editor and copy and paste the following code: Open your editor and copy and paste the following code:
  
-Now copy and paste the following code into your mypage.css file:+Now copy and paste the following code:
 >><​code>​ >><​code>​
     /* This sets the main content holder to the left of the page when no left menu is desired */      /* This sets the main content holder to the left of the page when no left menu is desired */ 
Line 77: Line 78:
     }</​code>​     }</​code>​
  
-Then save it as mypage.css (once again, make sure to include the .css extension or else your file will be saved as a .txt file by default).+Then save it as **mypage.css** (once again, make sure to include the .css extension or else your file will be saved as a .txt file by default).
  
-Then upload it to directory folder where the other CSS files reside, which is in the skins_site/​def/​styles/​ folder.+Then upload it to the directory folder where the other CSS files reside, which is in the skins_site/​def/​styles/​ folder.
  
 If you want to include any special styling to any of the content in your new page, include your CSS code in this file. If you want to include any special styling to any of the content in your new page, include your CSS code in this file.
Line 85: Line 86:
 \\ \\
 \\ \\
-===== 2. Creating a page with a left menu. =====+===== 2. Creating a page with a left menu column. =====
  
-You'll need to create ​five files, 2 PHP filew, 2 HTML files, and a CSS file.+You'll need to create ​files, 2 PHP files, 2 HTML files, and a CSS file.
  
 **The main PHP file** **The main PHP file**
 +
 +Open your editor and copy and paste the following code:
 +>><​code>​
 +<?php
 +/​******************************************************************************
 +Etano
 +===============================================================================
 +Software by:                DateMill (http://​www.datemill.com)
 +Copyright by:               ​DateMill (http://​www.datemill.com)
 +Support at:                 ​http://​www.datemill.com/​forum
 +*******************************************************************************
 +* See the "​docs/​licenses/​etano.txt"​ file for license. ​                        *
 +******************************************************************************/​
 +
 +require '​includes/​common.inc.php';​
 +require _BASEPATH_.'/​includes/​user_functions.inc.php';​
 +require _BASEPATH_.'/​skins_site/'​.get_my_skin().'/​lang/​login.inc.php';​
 +
 +$tpl=new phemplate(_BASEPATH_.'/​skins_site/'​.get_my_skin().'/','​remove_nonjs'​);​
 +
 +$tpl->​set_file('​content','​mypage.html'​); ​
 +$tpl->​process('​content','​content'​);​
 +
 +$tplvars['​title'​]='​My Title'; ​
 +$tplvars['​page_title'​]='​My Page Title';​
 +$tplvars['​meta_keywords'​]='​your,​ list, of, keywords'; ​
 +$tplvars['​meta_diz'​]='​your page description';​
 +$tplvars['​page'​]='​mypage'; ​
 +$tplvars['​css'​]='​mypage.css';​
 +if (is_file('​mypage_left.php'​)) {
 + include '​mypage_left.php';​
 +}
 +$no_timeout=true;​
 +include '​frame.php';​ </​code>​
 +
 +Then edit the info shown below in **BOLD**.
 +
 +$tpl->​set_file('​content','​**mypage**.html'​);​\\ ​
 +$tpl->​process('​content','​content'​);​\\
 +
 +$tplvars['​title'​]='​**My Title**'; ​ //<- adds title to top of browser//\\
 +$tplvars['​page_title'​]='​**My Page Title**'; ​ //<- adds title to top of html page//\\
 +$tplvars['​meta_keywords'​]='​**your,​ list, of, keywords**';​ \\
 +$tplvars['​meta_diz'​]='​**your page description**';​\\
 +$tplvars['​page'​]='​**mypage**';​ \\
 +$tplvars['​css'​]='​**mypage**.css';​ //<- adds a link to CSS file//\\
 +if (is_file('​**mypage**_left.php'​ \\
 +include '​**mypage**_left.php';​\\
 +include '​frame.php';​ //<- wraps the html page with the header and footer//
 +
 +
 +Save it as **mypage.php** (make sure to include the .php extension or else your file will be saved as a .txt file by default). Then upload your new PHP file to the main root directory where the index.php file is located.
 +
 +**The left PHP file**
 +
 +Open your editor and copy and paste the following code:
 +>><​code>​
 +<?php
 +/​******************************************************************************
 +Etano
 +===============================================================================
 +Software by:                DateMill (http://​www.datemill.com)
 +Copyright by:               ​DateMill (http://​www.datemill.com)
 +Support at:                 ​http://​www.datemill.com/​forum
 +*******************************************************************************
 +* See the "​docs/​licenses/​etano.txt"​ file for license. ​                        *
 +******************************************************************************/​
 +
 +$tpl->​set_file('​left_content','​mypage_left.html'​);​
 +$tpl->​set_var('​tplvars',​$tplvars);​
 +$tpl->​set_loop('​search',​create_search_form($basic_search_fields));​
 +$tpl->​process('​left_content','​left_content',​TPL_LOOP | TPL_NOLOOP | TPL_OPTIONAL);</​code>​
 +
 +Then edit the info shown below in **BOLD**.
 +
 +$tpl->​set_file('​left_content','​**mypage**_left.html'​);​
 +
 +Save it as **mypage_left.php** (make sure to include the .php extension or else your file will be saved as a .txt file by default). Then upload your new PHP file to the main root directory where the index.php file is located.
 +
 +
 +**The main HTML file**
 +
 +This is very simple, open notepad or your favorite editor and leave it "​**BLANK**"​ and save it as **mypage.html** (make sure to include the .html extension or else your file will be saved as a .txt file by default).
 +
 +Then upload it to the directory folder where the other HTML files reside, which is in the skins_site/​def/​ folder
 +
 +Now you are ready to add your content to the "​mypage.html"​ file, which can be just standard text or you can include standard html tags and markup as well. **Note:** you only need to add your page content, all the header and footer HTML is included by the frame file.
 +
 +
 +**The left HTML file**
 +
 +Open notepad or your favorite editor and leave it "​**BLANK**"​ and save it as **mypage_left.html** (make sure to include the .html extension or else your file will be saved as a .txt file by default).
 +
 +Then upload it to the directory folder where the other HTML files reside, which is in the skins_site/​def/​ folder.
 +
 +Now you are ready to add your content to the "​mypage.html"​ file, which can be just standard text or you can include standard html tags and markup as well. If you're unsure try referencing other left html files as it can vary depending on what template you're using. ​
 +
 +**The CSS file**
 +
 +Open notepad or your favorite editor and leave it "​**BLANK**"​ and save it as **mypage.css** (make sure to include the .css extension or else your file will be saved as a .txt file by default).
 +
 +Then upload it to the directory folder where the other CSS files reside, which is in the skins_site/​def/​styles/​ folder.
 +
 +If you want to include any special styling to any of the content in your new page, include your CSS code in this file.
creating_and_adding_custom_pages.1487224852.txt.gz · Last modified: 2017/02/16 06:00 by admin