Wrapped text links do not highlight properly
I ran into this today, and from my searches, it appears that this has been a problem with Xara web design tools going back to 2009 (first reference I saw, at least). Here's the issue:
I've created an FAQ page for a website that's in progress. Essentially, I've spelled out the questions on a single large text area ("text cursor"?) on a page. There's a carriage return between items, and the long ones wrap when they hit the width of the text block. I've increased the inter-line spacing, and it all looks great. I've set up a separate layer for items FAQ item that will pop up when the corresponding question link is clicked. Works great, looks great. Only problem is that when a question wraps to a second line (note: this is just a line wrap because the line is too long for the space available), when it's displayed in the browser, it acts as if there are two separate lines -- they highlight individually, even though they're really one continuous line, and should highlight as such.
Any thoughts on this? As I mentioned at the top, when I searched Google for this, one of the first hits I got was a 2009 post by a Xara user running into precisely this same issue.
Any suggestions or revelations would be most appreciated!
EDIT:
I just took a look at the page source that Xara WDP9 produced. Here's an example of a line that wound up wrapping because it's too long tor a single line:
<span class="xr_tl Normal_text" style="top: 76px;font-size:12px;color:#000000;"><a href="javascript:xr_cpu(6)" onclick="return(xr_nn());" onmousemove="xr_mo(this,24)" >I already have some life insurance and my spouse is constantly reminding me that I’m worth </a></span> |
|
<span class="xr_tl Normal_text" style="top: 91px;font-size:12px;color:#000000;"><a href="javascript:xr_cpu(6)" onclick="return(xr_nn());" onmousemove="xr_mo(this,24)" >more dead than I am alive. Is that really true?</a></span> |
1 Attachment(s)
Re: Wrapped text links do not highlight properly
Consequence of absolute positioning CSS, WYSIWYG'ness
To get around it [pun intended] you can add links using a character as a placeholder for the opening and closing anchor ref tag either side of the text string to be linked. You will also need to name the text area HTMLBlockText
See attached
Re: Wrapped text links do not highlight properly
Quote:
Originally Posted by
sledger
Consequence of absolute positioning CSS, WYSIWYG'ness
To get around it [pun intended] you can add links using a character as a placeholder for the opening and closing anchor ref tag either side of the text string to be linked. You will also need to name the text area HTMLBlockText
See attached
Thanks for the quick reply, and the solution!
Certainly workable. Will just be a bit tedious if I wind up with a lot of these. But this will let me keep chugging along without missing a beat. Thanks!
Re: Wrapped text links do not highlight properly
sledger, what am I missing?
I opened your file and reverted the text area, keeping HTMLBlockText, and added a normal Xara link. I stretched the link over four lines.
I got the following:
Code:
<div class="xr_tb Normal_text" style="left:571px; top:133px; width:105px">
<p class="xr_tu" style="font-size:16px;line-height:1.1em;">
Dolor aliquip
magna aliqua,
irure ut, sed
aliquip. Lorem
non laboris
ullamco. Amet,
excepteur nisi
reprehenderit
voluptate
consequat
eiusmod
minim qui
incididunt et
in. Tempor,
quis fugiat est
ut duis. <a href="http://xara-users.com">This
is one link
wrapped in a
text area</a>
</p>
</div>
Doesn't this do the necessary, just adding HTMLBlockText?
Acorn
Re: Wrapped text links do not highlight properly
I'm not sure what you did there or if you noticed the ► and ◄ placeholders, but it's certainly not a normal xara link as you say..
All xara htmlfilter links look something like this <a href="#" onclick="return(xr_nn());" onmousemove="xr_mo(this,0)" > - your's above does not.
Re: Wrapped text links do not highlight properly
sledger, I worked it out that in deleting the arrows your code remained.
Proof that you have to build from scratch when testing and not modify back.
Acorn
Re: Wrapped text links do not highlight properly
Quote:
Originally Posted by
Acorn
sledger, I worked it out that in deleting the arrows your code remained.
Acorn, if you remove those arrow text characters you will be removing the code because those arrows are placeholders for the code.
This little HTML placeholder trick was commonly used to add H1 tags to pages before Xara included them in version 8 and up.
It's also handy for other uses :)
1 Attachment(s)
Re: Wrapped text links do not highlight properly
I have been experimenting with a jQuery solution for this.
It still requires HTMLBlockText applied but nothing else.
The Pin in this .web page does the magic: Attachment 96725
I have tested it for Anchors and external URLs with no problems, but you must test you own site thoroughly if using it as a solution.
Acorn
Re: Wrapped text links do not highlight properly
Does not appear to work, Acorn.
For example - the top right text block (the one with the pin repelling text) shows this in the source code;
Code:
<div class="xr_tb Normal_text" style="left:320px; top:24px; width:374px">
<p class="xr_tu" style="line-height:1.1em;">
Do quis reprehenderit irure dolor minim ipsum
proident, velit cillum aliqua incididunt.
Excepteur aliquip commodo <a href="http://www.bing.com" target="_self" onclick="return(xr_nn());" onmousemove="xr_mo(this,0)" >aliqua labore </a>
<a href="http://www.bing.com" target="_self" onclick="return(xr_nn());" onmousemove="xr_mo(this,0)" >incididunt consectetur amet consectetur in </a>
<a href="http://www.bing.com" target="_self" onclick="return(xr_nn());" onmousemove="xr_mo(this,0)" >aliquip </a><a href="http://www.bing.com" target="_self" onclick="return(xr_nn());" onmousemove="xr_mo(this,0)" >deserunt esse fugiat nostrud sint, qui cillum. </a>
<a href="http://www.extra.com" onclick="return(xr_nn());" onmousemove="xr_mo(this,0)" >Pariatur </a><a href="http://www.test.com" target="_parent" onclick="return(xr_nn());" onmousemove="xr_mo(this,0)" >sed pariatur, velit nulla. Exercitation labore nisi </a>
<a href="http://www.test.com" target="_parent" onclick="return(xr_nn());" onmousemove="xr_mo(this,0)" >aliquip sed pariatur magna, lorem dolor</a>
</p>
<p class="xr_tu" style="line-height:1.1em;">
</p>
</div>
As you can see, the link to bing.com and test.com are split across multiple lines to create multiple links.
It's much simpler and cleaner to use the method I described earlier and needs no jquery code in the head.
Re: Wrapped text links do not highlight properly
sledger, it gracefully defaults to normal Xara code if jQuery is not invoked. It needs an Internet connection to download jQuery.
Once this is in your local cache, a connection is not required.
I will look for other fail modes.
Acorn