I recently made a posting about "how dow we change the layouts in v8 without losing everything" and one item that came up in here was that the v8 sitemap layout is very amatuerish.
I was playing about with a sitemap last night and came up with a relatively easy way of changing the look and feel - thought I would share the idea with others. If I am teaching people to suck eggs, sorry, but reading the forum, there's a lot of people at the beginning of the ladder of re-designing actinic layouts.
Some people might also say my formatting is naff, I'm only using this as an example to prove a point - in my case the formatting is "extremely simple" to show a point, no doubt others can change it suit their requirements.
here goes.
click on the "design tab" at the top of the "page preview" window
find the word "</head>" on the layout code
insert the following code JUST ABOVE the word "</head>"
(I've included the style directly into the sitemap page, rather than an external file, because the actual styles will only ever be used within the sitemap page.)
now click on the one of the page titles within the sitemap
this should open up the "layout code" pane with the "Site Map Section Link" ( the code currently being used to do the layout )
Highlight ALL of the code and CUT it out, place that code in notepad or something if you want.
now replace the code with a new piece of code as follows:
now simply apply the changes and preview the page.
and thats it.
In my case, all it did was to indent the sections by 20px just to prove a point.
Its up to you to change the layout styles to suit your site.
for those interested, an explanation as to whats happening,
in the original layout, actinic placed a single space for each of the levels of the site map., I've deleted all that code and replaced it with a bit of code that generates
[CODE]<span class="sectLev"followed by the current section number followed by >SectionName</span>CODE]
the actual generated code looks like this:
this allows CSS formatting to take place according to the section level, by adjusting the "padding-left" on each style, the indent can be increased or decreased to suit.
so thats the concept, now its up to anyone else to play with the code.
kev
I was playing about with a sitemap last night and came up with a relatively easy way of changing the look and feel - thought I would share the idea with others. If I am teaching people to suck eggs, sorry, but reading the forum, there's a lot of people at the beginning of the ladder of re-designing actinic layouts.
Some people might also say my formatting is naff, I'm only using this as an example to prove a point - in my case the formatting is "extremely simple" to show a point, no doubt others can change it suit their requirements.
here goes.
click on the "design tab" at the top of the "page preview" window
find the word "</head>" on the layout code
insert the following code JUST ABOVE the word "</head>"
Code:
<style type="text/css">
<!--
.sectLev0 {
text-align: left;
padding-left: 20px;
}
.sectLev1 {
text-align: left;
padding-left: 40px;
}
.sectLev2 {
text-align: left;
padding-left: 60px;
}
.sectLev3 {
text-align: left;
text-indent: 80px;
}
.sectLev4 {
text-align: left;
text-indent: 1000px;
}
.sectLev5 {
text-align: left;
text-indent: 1200px;
}
-->
</style>
now click on the one of the page titles within the sitemap
this should open up the "layout code" pane with the "Site Map Section Link" ( the code currently being used to do the layout )
Highlight ALL of the code and CUT it out, place that code in notepad or something if you want.
now replace the code with a new piece of code as follows:
Code:
<actinic:block if="%3cactinic%3avariable%20name%3d%22IsSectionIncludedInSiteMap%22%20%2f%3e" >
<a href='<actinic:block if="%3cactinic%3avariable%20name%3d%22IsLoginPageSuppressed%22%20%2f%3e%20AND%0d%3cactinic%3avariable%20name%3d%22UnregCustomersAreNotAllowed%22%20%2f%3e" ><actinic:variable name="SectionPageName" /></actinic:block><actinic:block if="%28%3cactinic%3avariable%20name%3d%22IsLoginPageSuppressed%22%20%2f%3e%20%3d%3d%20false%29%20OR%0d%28%3cactinic%3avariable%20name%3d%22UnregCustomersAreNotAllowed%22%20%2f%3e%20%3d%3d%20false%29" ><actinic:variable name="SectionURL" /></actinic:block>'>
<span class="sectLev<actinic:variable name="SectionLevel" />"><Actinic:Variable Name="SectionName"></span>
</a><br />
</actinic:block>
and thats it.
In my case, all it did was to indent the sections by 20px just to prove a point.
Its up to you to change the layout styles to suit your site.
for those interested, an explanation as to whats happening,
in the original layout, actinic placed a single space for each of the levels of the site map., I've deleted all that code and replaced it with a bit of code that generates
[CODE]<span class="sectLev"followed by the current section number followed by >SectionName</span>CODE]
the actual generated code looks like this:
Code:
<span class="sectLev1">Test level 1</span> <span class="sectLev2">Test level 2</span>
so thats the concept, now its up to anyone else to play with the code.
kev
Comment