Peek-a-Boo Part II: Unhiding pages for RedDot CMS SmartEdit users with some CSS

The latest post from Frederic works very well and your SmartEdit users still will be able to reach the pages inside the RedDot CMS. But for usability reasons you should extend it just for one more step. Let's take the part marked above with "... show navigation ..." as the following code:

HTML:
  1. <li><a href="linked_page.html">Linktext</a></li>

That's just fine and in genereal you will always get it with Freds code in SmartEdit.
But you want a user to know quick and easy: Is this page hidden or not?
So what? Just use some simple CSS Code:

CSS:
  1. .navhidden {
  2.   filter:alpha(opacity=40);
  3.   -moz-opacity:0.4;
  4.   -khtml-opacity: 0.4;
  5.   opacity: 0.4;
  6. }

Your HTML / Render Tag code should look like Freds just a bit turned upside down:

XML:
  1. <reddot:cms>
  2. <if>
  3.   <query valuea="Context:CurrentPage.Elements.GetElement(opt_show_in_navigation).GetHtml()" operator="!=" valueb="String:hide">
  4.     <htmltext>
  5.       <!--  ... show navigation for normal "non-hidden" pages  ... -->
  6.       <li><a href="linked_page.html">Linktext</a></li>
  7.     </htmltext>
  8.   </query>
  9.   <query type="else">
  10.     <if>
  11.       <query valuea="Context:CurrentRenderMode" operator="!=" valueb="Int:2">
  12.         <htmltext>
  13.           <!--  ... show navigation for hidden pages just
  14.                   inside the RedDot CMS system but
  15.                   with an opcity style ... -->
  16.           <li class="hidden"><a href="linked_page_hidden.html">Hidden linktext</a></li>
  17.         </htmltext>
  18.       </query>
  19.     </if>
  20.   </query>
  21. </if>
  22. </reddot:cms>

Using the render tag with the RedDot CurrentRenderMode as posted before veryfies, that the delivered output is wether preview, SmartEdit or publishing mode.

1 Star2 Stars3 Stars4 Stars5 Stars (6 votes, average: 4.67 out of 5)
Loading ... Loading ...

3 Reaktionen zu “Peek-a-Boo Part II: Unhiding pages for RedDot CMS SmartEdit users with some CSS”

  1. Dorin

    Hi Frederic,

    great work! I know and like your way to work very much.

    Cheers
    Dorin

  2. Burkhard Pauli

    Hi Frederic,

    very nice! It’s a powerful feature and you can also realise a LiveServer SSL-Switch with this approach. Here is how I did that:

  3. Burkhard Pauli

    <reddot:cms>
    <if>
    <query valuea=”Context:CurrentRenderMode” operator=”==” valueb=”Int:2″>
    <if>
    <query valuea=”Context:CurrentPage.Elements.GetElement(opt_secure).GetHtml()” operator=”==” valueb=”String:ssl”>
    <htmltext>
    <rde-dm:attribute mode=”condition” source=”request” attribute=”rdeServletServer” op=”contains” value=”80″>
    <rde-dm:process mode=”redirect” url=”[#request:rdeHttpsServer#]/[#request:rdePrefix#]/xchg/[#request:rdeSessionID#]/[#request:rdeProjectID#]/[#request:rdeXslID#]/-/[#request:rdeCurrentXmlId#]” status=”301″ />
    </rde-dm:attribute>
    </htmltext>
    </query>
    <query type=”else”>
    <htmltext>
    <rde-dm:attribute mode=”condition” source=”request” attribute=”rdeServletServer” op=”contains” value=”443″>
    <rde-dm:process mode=”redirect” url=”[#request:rdeHttpServer#]/[#request:rdePrefix#]/xchg/[#request:rdeSessionID#]/[#request:rdeProjectID#]/[#request:rdeXslID#]/-/[#request:rdeCurrentXmlId#]” status=”301″ />
    </rde-dm:attribute>
    </htmltext>
    </query>
    </if>
    </query>
    </if>
    </reddot:cms>