|
How to use a different design for
each page of an XSitePro site?
Generally speaking you would want to stick with 1 site design.
Brand your site to make it easily identifiable, no matter what page
they are on. That being said, if you do have a reason to use
different designs, for say different sections, here is how to do
it.
- Create a main website project folder.
- Within the main project folder, you will use different websites
for each section.
- Each website can have it's own design, and you can also use a
different folder in the publishing details, thus giving you website
directories.
- Site 1 - Layout 1
- Site 2 - Layout 2 - Different upload directory if you choose
- Site 3 - Layout 3 - Different upload directory if you choose
- To link each website section together open each website
section, and click the Web Pages tab.
- Click on Add > External Link
- In INFO Select "Link To > Another Page in XSitePro".
- choose the page you want to link to. Repeat for every website
section you created.
- Then link all using Link to another page within XSP.
How do I add borders to my
site?
You can add borders to your site very
easily with a little bit of custom CSS.
Click on OTHER > Scripts > Top Box
Enter This Code:
<style type="text/css">
TABLE.XSP_OUTLINE{HEIGHT: 100%; WIDTH: XXXpx; border : Xpx
solid #XXXXXX;}
</style>
Change the X's to match your needs.
How do I add drop shadow
borders to my site?
In your favorite graphics editor, create an image.
say 2500px wide, 10px high.
Make the background whatever color you want your site background to
be.
In the center, draw a box the exact width of your page (770px or
whatever you use).
Add a drop shadow effect to the box.
Save a bg.jpg.
Enter this code in Other | Scripts | Top Box
<style>
body {MARGIN-TOP: 0px;
background-color:#XXXXXX;
background-image: url("bg.jpg");
background-repeat: repeat-y;
background-position: center;
}
</style>
Change the X's to match your needs.
How Do I change
link colors on the site?
You can add
borders to your site very easily with a little bit of custom
CSS.
Go to Other > Scripts > Top Panel and enter this:
<style type="text/css">
a {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #333333;
padding: 0px;
text-decoration: none;
}
a:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #333333;
padding: 0px;
text-decoration: underline;
}
</style>
Adjust size, font and and color as needed.
How Do I link
to a specific section of a
page?
Used named anchors with your
links.
On the section you want to link to, place a named anchor (the
anchor symbol in the toolbar).
On your home page (or whereever you want to put the link
to the section), set your link to go to the sections main page, add
the named anchor to the url using a # followed by the name of the
anchor.
<a href="your_page.html#your_name" title="Click
Here">Your Link Text </a>
| 
