changing class names in format using velocity
I created an article page that uses velocity. There's a class name in the HTML that changes the effect of the article. I think the best way is to have a dropdown with the class name inside and it will replace the section of the name with that content.
Here's the Velocity
#set($author = $_XPathTool.selectSingleNode($contentRoot,"//author").value)
#set($datetime = $_XPathTool.selectSingleNode($contentRoot,"//datetime").value)
#set($mainContent = $_XPathTool.selectSingleNode($contentRoot,"//system-page/system-data-structure/main-content"))
#set($mainImage = $_XPathTool.selectSingleNode($contentRoot,"//mainImage/link").value)
#set($mainTitle = $_XPathTool.selectSingleNode($contentRoot,"//headline").value)
#set($tagline = $_XPathTool.selectSingleNode($contentRoot,"//tagline").value)
<div class="container intro-effect-fadeout" id="container">
<!-- Top Navigation -->
<header class="header">
<div class="bg-img">
<img src="$mainImage" alt="Celebrating 125 years" />
</div>
<div class="title">
<h1>$mainTitle</h1>
<p class="subline">
<p class="subline">$tagline</p>
</p>
<p>by <strong>$author</strong> — Posted in <strong>Animals</strong> on <strong>$datetime</strong></p>
</div>
</header>
<article class="content">
<div>
$_SerializerTool.serialize( $mainContent, true)
</div>
</article>
</div>
Right now this line <div class="container
intro-effect-fadeout" id="container">
has the name
fadeout
hardcoded into the format.
I created a dropdown with the other class names
<system-data-structure>
<text type="dropdown" identifier="effect" label="Choose Effect">
<dropdown-item value="push"/>
<dropdown-item value="fadeout"/>
<dropdown-item value="sliced"/>
<dropdown-item value="side"/>
<dropdown-item value="sidefixed"/>
<dropdown-item value="grid"/>
<dropdown-item value="jam3"/>
</text>
How can I create it so that the dropdown inserts the name into the class name?
Comments are currently closed for this discussion. You can start a new one.
Keyboard shortcuts
Generic
? | Show this help |
---|---|
ESC | Blurs the current field |
Comment Form
r | Focus the comment reply box |
---|---|
^ + ↩ | Submit the comment |
You can use Command ⌘
instead of Control ^
on Mac
Support Staff 1 Posted by Tim on 03 Jul, 2014 03:13 PM
Hi Matthew,
If I understand correctly, you should just be able to create a variable to store the effect (much like you are setting the author, datetime, etc) and then place that effect variable in your
would maybe look something like this:<div>
statement. At that point, for example, this line:(where $effect is the variable you've created that contains the setting from the Page)
Hope this helps!
2 Posted by matthew.wren on 03 Jul, 2014 03:21 PM
okay that's what I thought!
I added this to the format
<div class="container intro-effect-$effect" id="container">
but I don't' think I have this snippet written correctly
#set($effect = $_XPathTool.selectSingleNode($contentRoot,"//dropdown").value)
do I have to do something differently since it's a dropdown?
Support Staff 3 Posted by Tim on 03 Jul, 2014 03:46 PM
I would recommend taking a look at the XML output for a Page where you've selected an effect. This will give you an idea of how you'll need to write your XPath statement. If you still have trouble, feel free to attach the XML output for one of these Pages and I'll be happy to take a look.
Thanks!
4 Posted by matthew.wren on 03 Jul, 2014 05:19 PM
I'm tried a few things with no success.
this is the data structure XML
The Velocity Format
And the format with the xml output from the page.
Support Staff 5 Posted by Tim on 03 Jul, 2014 07:19 PM
So, it looks like in your Format you've done this:
But if you look at the actual output of the Page in question, you'll see that there is no 'dropdown' element. Instead, the effect is located here:So, you'll need to change your XPath statement to something like this:
Let me know if that makes sense.
Thanks
6 Posted by matthew.wren on 03 Jul, 2014 07:34 PM
of course that makes sense...and works! Thank you! Are there more resources about velocity (and maybe xslt)? I've been looking at http://www.hannonhill.com/kb/Script-Formats/ but it's the only thing I've found about Velocity.
Support Staff 7 Posted by Tim on 03 Jul, 2014 07:55 PM
Glad I could help!
You can check out the Apache Velocity site for a decent intro to using Velocity. Just keep in mind that not all of the libraries they use throughout the Apache docs are available within Cascade Server.
XSLT, on the other hand, has numerous resources available. The first one that comes to mind:
http://www.w3schools.com/xsl/
And actually, if you check out this post, you'll see folks mentioning a bunch of other resources that they find useful.
Hope this helps!
Tim closed this discussion on 27 Apr, 2015 07:18 PM.