Home → How Do I... →

Prevent Cascade from removing anchor tags.

• Edit

webadmin

13 Jul, 2015 04:28 PM

I'm wrapping divs in anchor tags within a block. Whenever I attempt to publish this, the system removes the anchor tags entirely. I tried wrapping them in CDATA tags, but that caused them to render as text only. How do I prevent the system from removing my tags?

1. 1 Posted by webadmin on 13 Jul, 2015 04:42 PM

   

   Now, the same page is eating a link I'm trying to create. Every time I put in a link, it then somehow removes the value out of the "href" field, replacing it with a #. Why is it doing this?

   • Edit

2. 2 Posted by Ryan Griffith on 13 Jul, 2015 06:41 PM

   

   Hi,

   When you have a moment, please attach or paste the HTML that is being rewritten.

   Offhand, I believe the issue is due to the way TinyMCE is currently configured. That is, we're using an xHTML configuration so block level elements are considered invalid within <a> tags. This will cause TinyMCE to rewrite the content in an attempt to create valid xHTML code. Your best bet at this point would be to try using <span> tags instead of <div> and style them as block elements using CSS.

   Please let me know if you have any questions.

   Thanks!

   • Edit

3. 3 Posted by webadmin on 13 Jul, 2015 07:02 PM

   

   Here's the chunk of code I'm attempting to use:

   <ul class="item-list">
                   <li>
                       <a href="/why/default">
                           <div class="img-box">
                               <img src="[system-asset]/_skin/images/img4.jpg[/system-asset]" height="342" width="266" alt="image description">
                               <span class="title">new orleans</span>
                           </div>
                       </a>
                   </li>
                   <li>
                       <a href="/extensions/default">
                           <div class="img-box">
                               <img src="[system-asset]/_skin/images/img5.jpg[/system-asset]" height="342" width="266" alt="image description">
                               <span class="title">extension centers</span>
                           </div>
                       </a>
                   </li>
                   <li>
                       <a href="/online-seminary/default">
                           <div class="img-box">
                               <img src="[system-asset]/_skin/images/img6.jpg[/system-asset]" height="342" width="266" alt="image description">
                               <span class="title">online</span>
                           </div>
                       </a>
                   </li>
                   <li>
                       <a href="/graduate-program/graduate-hybrid-courses">
                           <div class="img-box">
                               <img src="[system-asset]/_skin/images/img7.jpg[/system-asset]" height="342" width="266" alt="image description">
                               <span class="title">hybrid</span>
                           </div>
                       </a>
                   </li>
               </ul>
   

   Are you saying there's no way for me to force Cascade to accept this code? I'd really like for the entire div to be clickable.

   • Edit

4. 4 Posted by Ryan Griffith on 13 Jul, 2015 07:20 PM

   

   Hi,

   The only ways around this would be to:

   Surround the code with a <!--#protect code section:
   

   <!--#protect
   <ul class="item-list">
                   <li>
                       <a href="/why/default">
                           <div class="img-box">
                               <img src="[system-asset]/_skin/images/img4.jpg[/system-asset]" height="342" width="266" alt="image description">
                               <span class="title">new orleans</span>
                           </div>
                       </a>
                   </li>
                   <li>
                       <a href="/extensions/default">
                           <div class="img-box">
                               <img src="[system-asset]/_skin/images/img5.jpg[/system-asset]" height="342" width="266" alt="image description">
                               <span class="title">extension centers</span>
                           </div>
                       </a>
                   </li>
                   <li>
                       <a href="/online-seminary/default">
                           <div class="img-box">
                               <img src="[system-asset]/_skin/images/img6.jpg[/system-asset]" height="342" width="266" alt="image description">
                               <span class="title">online</span>
                           </div>
                       </a>
                   </li>
                   <li>
                       <a href="/graduate-program/graduate-hybrid-courses">
                           <div class="img-box">
                               <img src="[system-asset]/_skin/images/img7.jpg[/system-asset]" height="342" width="266" alt="image description">
                               <span class="title">hybrid</span>
                           </div>
                       </a>
                   </li>
               </ul>
   #protect-->
   

   Or, use an XML Block since it will not be adhered to the TinyMCE validation routines.

   Please let me know if you have any questions.

   Thanks!

   • Edit

5. 5 Posted by webadmin on 13 Jul, 2015 08:26 PM

   

   Protect worked, though I'm still having the other problem. I'm looking at a link, and it's formatted correctly, but it won't click at all. Here's the page: http://www.nobts.edu/academics/defaultNew.html

   Under the heading "World-Class Faculty", the second sentence ends with "click here". Problem is, I'm unable to click the link, even though it looks perfectly fine to me.

   • Edit

6. Ryan Griffith closed this discussion on 20 Aug, 2015 02:01 PM.