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

creating_and_adding_custom_pages [2017/02/16 06:32]
admin [1. Creating a wide page with no 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 3 files, 1 PHP file, 1 HTML file, and 1 CSS file. You'll need to create 3 files, 1 PHP file, 1 HTML file, and 1 CSS file.
Line 38: Line 38:
 $tplvars['​css'​]='​mypage.css';​ $tplvars['​css'​]='​mypage.css';​
 include '​frame.php';​ </​code>​ include '​frame.php';​ </​code>​
 +
 +Then edit the info shown below in **BOLD**.
  
 $tpl->​set_file('​content','​**mypage**.html'​);​\\ ​ $tpl->​set_file('​content','​**mypage**.html'​);​\\ ​
Line 50: Line 52:
 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 5 files, 2 PHP files, 2 HTML files, and a CSS file. You'll need to create 5 files, 2 PHP files, 2 HTML files, and a CSS file.
Line 124: Line 125:
 $no_timeout=true;​ $no_timeout=true;​
 include '​frame.php';​ </​code>​ include '​frame.php';​ </​code>​
 +
 +Then edit the info shown below in **BOLD**.
  
 $tpl->​set_file('​content','​**mypage**.html'​);​\\ ​ $tpl->​set_file('​content','​**mypage**.html'​);​\\ ​
Line 138: Line 141:
 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). Then 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). Then upload your new PHP file to the main root directory where the index.php file is located.
Line 161: Line 163:
 $tpl->​set_loop('​search',​create_search_form($basic_search_fields));​ $tpl->​set_loop('​search',​create_search_form($basic_search_fields));​
 $tpl->​process('​left_content','​left_content',​TPL_LOOP | TPL_NOLOOP | TPL_OPTIONAL);</​code>​ $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'​);​ $tpl->​set_file('​left_content','​**mypage**_left.html'​);​
- 
-Then edit the info shown above in **BOLD**. 
  
 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. 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.1487226778.txt.gz ยท Last modified: 2017/02/16 06:32 by admin