CKEditor breaking code & asp

Posted on 2013-05-12
Last Modified: 2013-11-03
On my page here I need to make each advert a whole link to the full page, as currently they have to click the company name which isn't enough due to the large bg hovers - the whole ad needs to be a link.

The problem is my developer had the silly idea of placing the 'EnhancedAdvertTemplate' in a the CKEditor 'content editor' for me to edit, and didn't realise I work in html frequently so I don't need it.

The problem with the CKEditor is that I can't edit the advert template to be a full link - every time I add an `<a>` tag to wrap the advert, the editor breaks the code and places the closing `</a>` right after the opening `<a>` - whereas it should be at the very end of the template so the link covers the full advert.


    <div class="enhancedAdTemplate Advert" id="Ad[AdPosition]">
     **<a href="<!--FullAdURL-->">**
    	<ul class="phone-web ">
    	<div class="logo"><!--ClientLogo--></div>
    	<ul class="contact">
    	<div class="tab aboutus">[SummaryText]</div>
    <div class="category"><!--Category--> in [Session:PublicFranchiseName]</div>

Open in new window

Then there's the asp page where he calls the EnhancedAdvertTemplate from the ckeditor:

 <table class="dir" cellpadding="0" cellspacing="0">
		adMode = ""
		adPosition = 1
			While Not rsDB_Ads.EOF
			if adMode = "" AND ""&rsDB_Ads("EnhancedListing") = "True" then 
				%><tr><td align="left" valign="baseline"><div class="dir_sub"></div></td></tr><%
				adMode = "Enhanced"
			end if
			if not adMode = "Standard" AND ""&rsDB_Ads("EnhancedListing") <> "True" then 
				%><tr><td><div class="dir_sub standard"></div></td></tr><%
				adMode = "Standard"
			end if
            strDB_ThisAdvertTemplate = rsDB_Ads("AdvertViewTemplate")
            If IsNull(strDB_ThisAdvertTemplate) OR strDB_ThisAdvertTemplate = "" then
				if adMode = "Enhanced" then
	                strDB_ThisAdvertTemplate = GetContent("DirectoryBrowser_Advert_EnhancedTemplate", Session("PublicFranchiseGID"))
					strDB_ThisAdvertTemplate = GetContent("DirectoryBrowser_Advert_StandardTemplate", Session("PublicFranchiseGID"))
				end if
            End if
            ' Handle Rows
            If iDB_RenderLastRow= 0 then
                ' Start Of Table
            ElseIf iDB_RenderRow > iDB_RenderLastRow then 
                ' Next Line
            End if
            If iDB_RenderLastColumn = 0 then
                ' New Row Column
                %><td align="left" valign="top"><%
            ElseIf iDB_RenderColumn > iDB_RenderLastColumn then
                ' Next Column
                %></td><td align="left" valign="top"><%
            End if
            ' Refresh Item Template, and Merge Values
            strDB_AdvertItem = strDB_ThisAdvertTemplate
            strTempHTML = ""
            %><!--#include virtual="/PageObjects/DirectoryBrowser/i_DirectoryAdvert.asp"--><%          
            ' Write out the Directory Item
            Response.Write strDB_AdvertItem
            if 1 = 2 and iDB_RenderColumn > iDB_RenderLastColumn then
                %><td align="left" valign="top"><%
            End if
            ' Reset "Last" details
            iDB_RenderLastRow = iDB_RenderRow
            iDB_RenderLastColumn = iDB_RenderColumn
            ' Set "Next" details
            iDB_RenderColumn = iDB_RenderColumn + 1
            If iDB_RenderColumn > iDB_AdvertPageWidth then
                iDB_RenderRow = iDB_RenderRow + 1
                iDB_RenderLastColumn = 0
                iDB_RenderColumn = 1
            End if
			adPosition = adPosition + 1

Open in new window

Basically, is there a way I can add an <a> tag in the asp or somehow get it work in the editor?

Hoping someone can help as it's a bit confusing! Many thanks.
Question by:UName10
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 6
  • 5
LVL 58

Expert Comment

ID: 39159488
Pre HTML5 you cannot wrap a inline element around a block element. Which is probably why its breaking - what doctype are you using?
You could revert to an onclick event.
LVL 52

Expert Comment

by:Scott Fell, EE MVE
ID: 39159821
I would just use jquery to loop through each of of the td's in table with class "dir".  Then grab the attribute href from the h2 onclick.  From there make the entire tr clickable.    That would not be the best for SEO though. I would also like to see the asp written with a direct link in the advert tr td so it can be clicked without js.
LVL 52

Expert Comment

by:Scott Fell, EE MVE
ID: 39159827
Check the page using chrome or firefox console.  There are a couple of errors on the page where a file is missing and that will muck up your js functions.
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!


Author Comment

ID: 39160036
Thanks for the replies, could you perhaps point me to how I can wrap the <a> without javascript - i.e. where in the code it needs to go?

Not sure which <tr> it is...

The <a> needs to go around .Advert which is called in from the CKeditor..
LVL 52

Expert Comment

by:Scott Fell, EE MVE
ID: 39160044
The problem as Dave pointed out you can end up with using xhtml

<a href=""><div class="advert">content</div></a>

Author Comment

ID: 39160093
Just a thought, can I place the advert templates code in an asp file and have include in here instead?

If IsNull(strDB_ThisAdvertTemplate) OR strDB_ThisAdvertTemplate = "" then
        if adMode = "Enhanced" then
            strDB_ThisAdvertTemplate = [b]GetContent("DirectoryBrowser_Advert_EnhancedTemplate", Session("PublicFranchiseGID"))[/b]
            strDB_ThisAdvertTemplate = [b]GetContent("DirectoryBrowser_Advert_StandardTemplate", Session("PublicFranchiseGID"))[/b]
        end if
    End if

Open in new window

Thanks again
LVL 52

Expert Comment

by:Scott Fell, EE MVE
ID: 39160283
The issue is the final rendered html.  I would work backwards and start with the what the final html should be and work the asp to create the end result.    

The way the page is set up  now is visually nice on the outside.  You do have a hard link but I would like to see the link built without javascript or at least have a fall back so google can acces it.  

Otherwise, to answer your original question on how to make the entire row become a link as it lights up is going to need javascript/jquery because the code will not work.

This is not good in xhtml or html5
    <a href=""><tr><td>this is a row</td><tr></a>

Open in new window

This is not good in xhtml but good in html5
<a href=""><div>stuff</div></a>

Open in new window

Since your current table thing will not work in xhtml, you need to use jquery to make it work.  Your other option is to recode the adverts to use div's and not tables but then you would need to change the page to html5 and not xhtml.    Since you already have the page made up in xhtml, it might be easier to use jquery.   The choice is up you.  If you are avoiding using jquery because you are not proficient, that can be worked out.

Author Comment

ID: 39161167
Hi thanks for the reply. Jquery doesn't solve the issue, but just compounds it as there's no need to use it as you understand. The code for that page needs redoing entirely which my developer will do, but for now I wanted to fix this one thing.. Jquery/script isn't the answer though; it's only an <a> tag and should be done in asp or via an include if possible.

So jquery for this is not an option for many reasons, not least because there's no need for it. Unfortunately it was coded a while ago and he should never have put the advert template in the ckeditor, I'll try an include and transfer the template html to the root.

Thanks again.
LVL 52

Expert Comment

by:Scott Fell, EE MVE
ID: 39161984
I understand. I was just offering as a work around.  Otherwise, the only thing to do is wait until your developer rebuilds whatever they need to do. I would suggest you create the page in static html the way you want it have the developer make the dynamic portion fit your needs.  

As is, there is no way to make the entire table row inside an href as that will not work.  Or am I not understanding what you want to do?  From what I understand you want to make the portion of code below clickable.   The problem is you can't simply wrap the tr or td tag inside an a tag.
          <td align="left" valign="top"><div class="enhancedAdTemplate Advert" id="Ad1">
              <ul class="phone-web ">
                <li>01277 213333</li>
                <li><a href='' onclick="pageTracker._trackPageview('/WEBSITE/');" target='_blank' rel='nofollow'><span>»</span> Website</a><br />
              <h2><a onclick="pageTracker._trackPageview('/ADVERT/My Violet Hill Boutique');" href='/brentwood/shops-and-shopping/clothes-shops/my-violet-hill-boutique-560.html'>My Violet Hill Boutique</a></h2>
              <div class="logo"><img src='/LiveStorage/Uploads/Image/Client Logos/C379194B-0013-47FD-8188-60C542AE69BB.jpg' alt='My Violet Hill Boutique' /></div>
              <ul class="contact">
                <li>21, Crown Street,</li>
                <li>CM14 4BA</li>
              <div class="tab aboutus">Since launching the website for womens clothes online the company has successfully established itself as providing the best, most exciting, unique and on-trend womens clothes and accessories.</div>
              <a class="fullstd" onclick="pageTracker._trackPageview('/FULL_AD/[FullAdLink]');" href='/brentwood/shops-and-shopping/clothes-shops/my-violet-hill-boutique-560.html'>view profile</a>&nbsp; <a class="refer" href="/ReferToFriend.asp?CAGID={C379194B-0013-47FD-8188-60C542AE69BB}">send advert</a>&nbsp;
              <div class="category">Clothes Shops in Brentwood</div>

Open in new window

You can try adding the <a> tag around the div portion  so you end up with
<a href="">
<div class="enhancedAdTemplate Advert" id="Ad1">
<div class="category">Clothes Shops in Brentwood</div>

Open in new window

I know this would work if the page was set as html but I don't think it will work as xhtml.

If I missed your point, I am sorry....

Accepted Solution

UName10 earned 0 total points
ID: 39167729
No don't worry, it's difficult to tell... I'll probably just get him to change it or transfer the template into html. Thanks for the help though.
LVL 52

Expert Comment

by:Scott Fell, EE MVE
ID: 39609749
>No don't worry, it's difficult to tell... I'll probably just get him to change it or transfer the template into html. Thanks for the help though.

Edit:  Sometimes the answer is no answer  

We do spend time to try and help you, did nothing in this thread help you come to your conclusion?

Author Closing Comment

ID: 39619683
No solution

Featured Post

Online Training Solution

Drastically shorten your training time with WalkMe's advanced online training solution that Guides your trainees to action. Forget about retraining and skyrocket knowledge retention rates.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
How to build a web site 17 60
help thx 6 24
Jquery HTML() with ajax... replacing content 2 32
Want an individual results display div 8 48
This article will inform Clients about common and important expectations from the freelancers (Experts) who are looking at your Gig.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

730 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question