r1853 - image tags

hcgtv · 2006-09-27 05:15:49

Just updated my test site and something changed in the image tags.

I use this in my sidebar:
<code><p><a href=“http://spreadfirefox.com/”><txp:image id=“13” class=“sidebar” /></a></p></code>

This is in my CSS:
<code>img.sidebar {
border: none;
}</code>

Since the default template was putting a red border on images, I did the above quick fix. But now the red border is back, am I doing something wrong?

jm · 2006-09-27 05:27:32

Have you tried a img { border: 0; } or a img.sidebar { border: 0; /*or none*/}?

Last edited by jm (2006-09-27 05:28:24)

hcgtv · 2006-09-27 05:30:06

Thanks jm, that did it.

This works: <code>a img { border: none; }</code> or <code>border: 0;</code> but putting <code>a img.sidebar</code> doesn’t, wonder why?

Last edited by hcgtv (2006-09-27 05:35:04)

Mary · 2006-09-27 05:33:36

Yes – the ids & classes are now applied to the wraptag (for consistency).

hcgtv · 2006-09-27 05:45:41

Mary, call me ignorant.

How would you apply a style to an image then, cause on some of my sites I have a class on images for wrapping text around them.

Is this ok?

In the article:
<code><txp:image id=“111” class=“content” /></code>

In the CSS:
<code>img.content {
margin: 6px 6px 0 4px;
padding: 0 6px 0 4px;
float: left;
}</code>

wet · 2006-09-27 06:23:36

I’m not quite sure what the purpose of wraptag for these kind of element was, anyhow.

From my understanding, wraptag initially was intended as a means for suppressing a wrapping element in case the enclosed element rendered no contents (txp:category_list for instance).

Now it is starting to spread across more txp tags, even those which can be wrapped easily in forms or pages without risking empty wrap elements.

What might be the purpose, consistency set aside? I can’t think of a use case where traditional markup wouldn’t suffice.

Last edited by wet (2006-09-27 06:23:56)

Mary · 2006-09-27 06:55:04

For image and thumbnail, yes. For article_image, no. The other is there because you’d expect it to be.
For posted, because it was, apparently, supposed to be there in the first place.
Does it matter, really? :)

wet · 2006-09-27 07:31:34

Not at all. It’s just my curious personality, and then it’s a small candy for the “bloat alarm” trolls.

hcgtv · 2006-09-27 14:08:51

I upgraded to r1857 this morning, tested the wrapping of text mentioned in post #5 in this thread and I can’t get it to work.

How would I make it work now with the changes coming in 4.0.4?

Mary · 2006-09-28 03:41:08

Sorry Bert, missed your post there. Ah, I see, a problem with combining with Textile. You’d apply the class to the wrapping tag, as opposed to the image itself.

article:

p(your-class). <txp:image id="111" />

In the CSS:

.your-class {
margin: 6px 6px 0 4px;
padding: 0 6px 0 4px;
float: left;
}

hcgtv · 2006-09-28 16:10:19

Thanks Mary, I’m playing around with your example.

What’s odd is that I had to increase one of the margin properties from 6px to 10px for the image to align. Seems like the image is now it’s own block, where in the past it was sort of sucked into the paragraph.

Last edited by hcgtv (2006-09-28 23:05:00)

hcgtv · 2006-09-28 18:47:17

In my excitement to get this working, I left out the user equation.

These changes to the code base basically eliminate the class=”“ and style=”“ attributes of the tag, then shouldn’t the tag builder be updated?

Edit: I think we’re taking a step backwards here, the tag builder is in place, we could ship left and right aligned classes in the default CSS and voila, we empower the user.

When it comes to publishing on the internet, beginners and experts alike are met with a bothersome paradox: word processors and graphics applications allow anyone to do a pretty good job of managing text and images on a personal computer, but to make these available to the worldwide web – a seemingly similar environment of documents and destinations – ease of use vanishes behind sudden requirements for multilingual programming skills, proficiency in computer-based graphic design, and, ultimately, the patience of a saint.

Last edited by hcgtv (2006-09-28 19:00:14)

Mary · 2006-09-29 01:08:00

I can’t eliminate style yet, for backwards compatibility. Class is still applied, but to a wrapping tag.

phiw13 · 2006-09-29 03:31:50

There is something confusing me in this discussion…
[case 1] When I do [ img src="http://127.0.0.1/txptest/images/2.png" width="80" height="80" alt="test image" class="myimage" /], aka use ‘xhtml’ tag in the tagbuilder, the class is outputted correctly, attached to the image tag.
[case 2] But <txp:image class="myimage" id="2" />, using the ‘textpattern’ tag, then it fails to output the class in the image tag.

Case 1 is the behaviour I would want, and what Bert was looking for, I think.
Having a different behaviour for Case 2 is just confusing. Why wouldn’t you want to attach a class to the image tag? This becomes extremely problematic if you want for example to have an image floated left and an image floated right inside a long paragraph. There is no way you can define that in terms of CSS selectors, using syntax like p.myimage img {}.

I’ve always used the markup as in case 1, and that will work fine, Hopefully you won’t take away the parsing of the class attribute on the xhml tag…

Tested at rev 1860.

hcgtv · 2006-09-29 04:03:13

Philippe, I’ll give you my reasoning for using the txp image tag.

Textile: <code>!http://txpun.com/images/4.png (Open Source)!</code>
Textpattern: <code><txp:image id=“4” /></code>
XHTML: <code><img src=“http://txpun.com/images/4.png” width=“120” height=“100” alt=“Open Source” /></code>

If I decide to create another site from a section of TxPun or if I want to test my site locally, the Textpattern tag is portable. It was a relative path in 4.0.3 but now it’s the full url, don’t know why.

Textpattern CMS

Textpattern CMS support forum

#1 2006-09-27 05:15:49

r1853 - image tags

#2 2006-09-27 05:27:32

Re: r1853 - image tags

#3 2006-09-27 05:30:06

Re: r1853 - image tags

#4 2006-09-27 05:33:36

Re: r1853 - image tags

#5 2006-09-27 05:45:41

Re: r1853 - image tags

#6 2006-09-27 06:23:36

Re: r1853 - image tags

#7 2006-09-27 06:55:04

Re: r1853 - image tags

#8 2006-09-27 07:31:34

Re: r1853 - image tags

#9 2006-09-27 14:08:51

Re: r1853 - image tags

#10 2006-09-28 03:41:08

Re: r1853 - image tags

#11 2006-09-28 16:10:19

Re: r1853 - image tags

#12 2006-09-28 18:47:17

Re: r1853 - image tags

#13 2006-09-29 01:08:00

Re: r1853 - image tags

#14 2006-09-29 03:31:50

Re: r1853 - image tags

#15 2006-09-29 04:03:13

Re: r1853 - image tags

Board footer