To make enterprise station by phpcms, first of all, static enterprise home page should be replaced by dynamic home page which can be edited in the background.
Firstly, make a static homepage of enterprise website:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<style type="text/css">
ul li{
list-style: none;
display: block;
position: relative;
float: left;
width: 100px;
}
ul{
height: 50px;
}
.base{
color: #000000;
}
.col{
color: #0000FF;
}
ul li a{
text-decoration: none;
}
#header{
width: 1200px;
height: 50px;
border: solid 2px #000000;
}
#footer{
width: 1200px;
height: 50px;
border: solid 2px #000000;
}
.list{
position: relative;
width: 500px;
height: 250px;
margin-left: 50px;
border: solid 2px #000000;
margin-top: 10px;
float: left;
}
#content{
width: 1200px;
height: 550px;
}
</style>
<body>
<div id="header">
<ul>
<li ><a class="col" href="">home page</a></li>
<li ><a class="base" href="">Journalism</a></li>
<li ><a class="base" href="">Notice</a></li>
<li ><a class="base" href="">About us</a></li>
<li ><a class="base" href="">Join us</a></li>
</ul>
</div>
<div id="content">
<div class="list">Journalism<span style="padding-left: 430px;"><a href="#">More </a> </span> <p> Corruption Publication </p> </div>"
<div class="list">Notice<span style="padding-left: 430px;"><a href="#">More </a> </span> <p> Daniufang Grade 3 </p> </div>"
<div class="list">about<span style="padding-left: 430px;"><a href="#">More </a> </span> <p> Call you </p> </div>"
<div class="list">recruit<span style="padding-left: 430px;"><a href="#">More </a> </span> <p> follicular distress </p> </div>"
</div>
<div id="footer">
<ul>
<li ><a class="base" href="">Friendship link</a></li>
<li ><a class="base" href="">Link 1</a></li>
<li ><a class="base" href="">Link 2</a></li>
<li ><a class="base" href="">Link 3</a></li>
<li ><a class="base" href="">Link 4</a></li>
</ul>
</div>
</body>
</html>
Operation effect:
Import all JS and CSS files into the corresponding location under the static folder.
The file address will be modified according to the following format:
Replacement method:
{CSS_PATH} represents the CSS storage path defined by CMS
{JS_PATH} represents the JS storage path defined by CMS
{IMG_PATH} represents the image storage path defined by CMS
Setting up the template to be used
Change the default template in phpcms to the template you made.
Create a new English folder in phpcms/install_package/phpcms/templates
Create a content folder under this folder
Change the name of the. html web page file to index.html and put it in the content folder
Log in to the phpcms background, and you can see the interface - "Template Style will display the newly added templates
Settings - "Site management to select template style, point determination.
Update the cache after generating the home page
Click on the home page of the site to see that the template changes successfully:
2. Splitting Template
Break the template into header code, content code, tail code
New header.html and footer.html, respectively, remain in index.html
Add the code {template "content","header"} to the index.html header to import header.html
Add the code {template "content","footer"} at the end of index.html to import footer.html
III. Adding Columns
In header.html
First add a link to the navigation bar:
take
<ul>
<li ><a class="col" href="">home page</a></li>
<li ><a class="base" href="">Journalism</a></li>
<li ><a class="base" href="">Notice</a></li>
<li ><a class="base" href="">About us</a></li>
<li ><a class="base" href="">Join us</a></li>
</ul>
Revised to:
{pc:content action="category" catid="0" num="5" siteid="$siteid" order="listorder ASC"}
<ul >
<li><a class="base" href="{siteurl($siteid)}"><span>home page</span></a></li>
{loop $data $r}
<li><a class="base" href="{$r[url]}"><span>{$r[catname]}</span></a></li>
{/loop}
</ul>
{/pc}
num is the maximum number of columns
If you want to increase the navigation listening effect, add the code as follows:
<div id="header">
<ul>
{if $top_parentid==0}<!--Determine if the home page is displayed on the home page?-->
<li><a href="{siteurl($siteid)}" class="col">home page</a></li> <!--If it is the home page, add attribute fonts to the home page to display white.-->
{else}
<li><a href="{siteurl($siteid)}">home page</a></li><!--If it is not the home page, the content will be displayed normally.-->
{/if}
{pc:content action="category" catid="0" num="5" siteid="$siteid" order="listorder ASC"}
{if $catid==$r[catid] || $top_parentid==$r[catid]}<!--Judging display catid，If it is displayed catid-->
<li><a href="{$r[url]}" class="col">{$r[catname]}</a></li><!--Add attributes, fonts show white-->
{else}
<li><a href="{$r[url]}" class="base">{$r[catname]}</a></li><!--If not, the content will be displayed normally.-->
{/if}
{/pc}
</ul>
</div>
Display effect:
Display Home Page Only
Add columns:
In the background of phpcms, add a column to the content - "management" column
You can add the columns you need to add. Note that the template in the template settings should be changed to the current template.
Show:
IV. Adding Contents to Columns
Implement dynamic content in the following four div s
Modify the code for index.html
First, add more internal links:
Code:
<a href="{$CATEGORYS[10][url]}">More</a>
The number in the middle represents the code number of the phpcms backstage column
Set dynamic div content:
<div class="list">
//News <span style= "padding-left: 430px;">a href="{$CATEGORYS [10][url]}> more</a></span>
{pc:content action="lists" catid="10" num="1" siteid="$siteid" order="id DESC"}
{loop $data $r $val}
<p><a href="{$val[url]}">{$val[title]}</a></p>
<p>{$val[description]}</p>
{/loop}
{/pc}
</div>
The other three are the same way.
Tail footer.html traverses the same way as the head