Need better access to HTML Attributes

I understand how the first typed value in the Names is used for the value of the HTML id attribute: e.g., Apply Name [galleryId] > Add ==> id="galleryId".
Subsequent additions appear lower in the Names list and are effectively ignored.

Equally, including the phrase filename="..." allows the HTML scr attribute to be amended, e.g. Apply Name [filename="GalleryImage"] > Add ==> src="Gallery%20Image".
Again, subsequent additions appear lower in the Names list and are effectively ignored.

The HTML alt attribute is set with the web Properties > Image > Image caption (Alt Text): [Alt Text for the Gallery Image] ==> alt="Alt Text for the Gallery Image".

Provided the image is not used as a trigger for a Mouse-over layer, then setting Web Properties > Mouse-over > Show popup text (Title) sets the HTML title attribute: [Gallery Title Text] ==> title="Gallery Title Text".

I wish to use jQuery and my own code to further manipulate my images after they have been published; fade in/out being the simplest to visualise...
Provided I have applied Names to each image I could search for them separately with jQuery("#galleryId") for each and every unique id. This will lead to slow coding.
My solution seems to be constrained to prefixing all the images I want to manipulate with ids with a prefixed class as in Apply Name [ClassX:galleryId] > Add ==>id="ClassX:58galleryID" so I can properly add the ClassX using jQuery with jQuery(img [id^="ClassX"].addClass("ClassX").

I apologise for such detail but I wish to ask if anyone has a better approach?
Have I overlooked a current Xara kludge, as in the Names and filename="..." method, as I would love to see class="...", title="..." and style="..." included in future versions as any HTML element can have a class, title and style as well as an id.

I could search for them separately with jQuery("#galleryId") for each and every unique id. This will lead to slow coding.

Not really, because if you know the IDs, you can assign a class to that id and then manipulate them via the class.

something like

$("#my_image").addClass('fademe');
$("#my_image2").addClass('fademe');
$("#my_image3").addClass('fademe');

It may be tedious, but no more tedious than doing the same thing inside Xara. Then you can manipulate them via the class.
I'm not sure that's going to really help you though, because seeing ten images (say) fading in together at the same time, for example, is not going to be a good look.

I concur with fading 10 images together would be naff but I was trying to set the scene.
I might be looking at a homespun carousel of all the images with that class.
The other idea I was thing over was an accordion show/hide for headings and a fancier pop-up display on hover over images.
If a class assignment could be realised then I could apply that Name to multiple selections on a few clicks within Xara.

With respect, sounds like Xara Web Designer is the wrong application for you.

Quote:

---

Originally Posted by sledger

With respect, sounds like Xara Web Designer is the wrong application for you.

---

sledger, I don't see my interest here any different to those who want to include HTML in placeholders, use the tweaksets or experiment with the Highslide parameters (listed as Stickies in the Forum) or use the supplied Widgets. I would like to use jQuery sometimes rather than rely on undocumented features or HTML 5 Widgets than may come and go.
With a class applied to a group of objects below a vertical position, it would be possible to move them all down the page on the fly to allow for a dynamic replacement in a CMS.

All I was trying to establish was that I hadn't missed some feature that would make such things cleaner and clearer.
Acorn.

I think the difficultly is that you are essentially hacking the pages and while it can work and other people do mini-hacks via placeholders and the like, it's not really a natural use of Xara. Anyone who is manipulating pages like this might ask if life would be even easier not using Xara.

It's really an identification of a bit of a dilemma for Xara, people wanting to extend Xara functionality, but that in itself goes against what I've also thought to be the basic premise of Xara - design without needing to care about the underlying code.

Hi Acorn.

You have not missed anything. There's no way to specify custom classes or styles in current version. However, if you need this feature so much, I'll add the support of custom classes in the next version. I think this would be sufficient.

Quote:

---

Originally Posted by covoxer

... I'll add the support of custom classes in the next version. I think this would be sufficient.

---

That will be very useful, covxer. As jQuery is already in use in XWD, it will make make for better HTML integration.
Cheers, Acorn

:-bd How's that for developer support! Never let it be said that Xara doesn't listen :)

sledger, I am pleasantly stunned.
It has encouraged me to assist on this board more to pay off this debt!
Acorn

Quote:

---

Originally Posted by covoxer

Hi Acorn.

You have not missed anything. There's no way to specify custom classes or styles in current version. However, if you need this feature so much, I'll add the support of custom classes in the next version. I think this would be sufficient.

---

Did the custom classes option make its way into the new version of Web Designer?

Not found it yet. As it would be an "undocumented" feature, Xara may have named the label anything.
I was waiting for the XWD9(P) to settle.
It would be very handy and marry up with the HTML5 approach quite nicely.

Acorn

Yes, this undocumented feature is present in WD9. As it usually happens with undocumented features, it is implemented with a special object name. ;)
Use following name:

htmlclass=MyClass

, where "MyClass" is the class you want to add to the object.

Basically, it's the same syntax as with "filename=".

Make sure you know what you are doing when using this feature. It may not be safe, so if you get unpredictable results, revert back. Also feel free to ask if you have any problems with it.

Thanks for the update and for adding this! I'll have to download the trial to test this as I'm waiting for the Designer Pro version to buy.

Quote:

---

Originally Posted by covoxer

htmlclass=MyClass

---

A big thank you too!

Acorn

Acorn, could you please show an example of how you make use of this feature?

Quote:

---

Originally Posted by Boy

Acorn, could you please show an example of how you make use of this feature?

---

Away from home presently so just a small taster.
You need to examine each object's Name and then open the Page's HTML Code (Head) Placeholder to see CSS and jQuery manipulations.

With a little CSS, you could "frame" all your pictures, have them at opacity 40% until you click on them to come back up to full glory.
All doable in Xara but requires more graphic and layer manipulations, which are not truly scalable.

Rotating text, however, was something someone asked for recently and now it stays as text.

I agree that was all possible before but as there were only IDs, nesting of them failed; classes can be grouped more easily.
Classes also mean that one CSS change alters all items with that class name.

jQuery allows you to make your pages much more interactive.

Attachment 95759

Acorn

Thanks for posting this but as I am still using XDP X, nothing happens. I will have to wait till version 9 comes out. :(

Quote:

---

Originally Posted by Boy

Thanks for posting this but as I am still using XDP X, nothing happens. I will have to wait till version 9 comes out. :(

---

If you can cope with the hassle of unzipping this to your Desktop or folder, it will show you the end result:
Attachment 95789

Acorn

Interesting effect. I'll keep the files till the new version is out to take a better look. Thanks for posting.

John, htmlclass doesn't work with a text box but does with single line text. Is this intended?

Quote:

---

Originally Posted by jamesd

John, htmlclass doesn't work with a text box but does with single line text. Is this intended?

---

It works fine for me.
How are you using it?

Acorn

Quote:

---

Originally Posted by Acorn

It works fine for me.
How are you using it?

Acorn

---

Hi Acorn, it was only when I had also used HTMLBlockText on the text box :)