Page 1 of 1
TagCloud block view
Posted: Wed Jun 01, 2011 8:25 am
by LazyBadger
Just to note - compare two views of the same source (XML and NoNL-mode selected). I'll be happy to see browser-
independent code, which will show tags always with buttons in Opera-style, without widow xml.gif and the end of line.
BTW, I suppose nbsp in multiword's tags isn't best choice for long tags in narrow block
- Opera 11.11 TagCloud
- good-Opera.gif (1.84 KiB) Viewed 6540 times
- Firefox (and Safari) TagCloud
- bad-FF.gif (1.84 KiB) Viewed 6540 times
Re: TagCloud block view
Posted: Wed Jun 01, 2011 8:42 am
by LazyBadger
Yes, I tried to play with spans
Code: Select all
<span class="serendipity_freeTag_xmlTagEntry">
<a ...>
<img ... class ...>
</a>
<span class ... style ...>
<a ...>
Tag here
</a>
</span>
</span>
chain (with space and nbsp in multiwords tags, reverse hierarchy of internal span and a - span -> a vs a -> span) with no luck
Re: TagCloud block view
Posted: Wed Jun 01, 2011 10:31 am
by garvinhicking
Hi!
Did you try setting the CSS "white-space: no-wrap" attribute?
Regards,
Garvin
Re: TagCloud block view
Posted: Wed Jun 01, 2011 10:45 am
by LazyBadger
I see at no-wrap as at a "last resort" - because in case of long tag-string (wider than container) tag will be trimmed (which is bad behavior for aesthetic view) instead of wrapping words on new line (how it can be done now, if tags will get space between words instead of nbsp)
Re: TagCloud block view
Posted: Fri Jun 03, 2011 9:57 am
by garvinhicking
Hi!
I'm not sure I understand. What exactly are you suggesting to do?
Regards,
Garvin
Re: TagCloud block view
Posted: Fri Jun 03, 2011 11:11 am
by LazyBadger
In terms of generated HTML (partial example from block code)
Code: Select all
<img alt="xml" src="/templates/tabacco_s9y_07/img/xml.gif" class="serendipity_freeTag_xmlButton"></a> <span class="tag_weight_205" style="font-size: 205%;"><a rel="tag" href="http://www.lazybadger.ru/plugin/tag/%D0%BD%D0%B0+%D0%B7%D0%BB%D0%BE%D0%B1%D1%83+%D0%B4%D0%BD%D1%8F" title="на злобу дня (17) ">на злобу дня</a>
will become semantically clean
Code: Select all
<img alt="xml" src="/templates/tabacco_s9y_07/img/xml.gif" class="serendipity_freeTag_xmlButton"></a> <span class="tag_weight_205" style="font-size: 205%; white-space: normal;"><a rel="tag" href="http://www.lazybadger.ru/plugin/tag/%D0%BD%D0%B0+%D0%B7%D0%BB%D0%BE%D0%B1%D1%83+%D0%B4%D0%BD%D1%8F" title="на злобу дня (17) ">на злобу дня</a>
nbsp between img and span must
not work according to specification (string elements
aren't words), nbsp between words in multiword tags are bad idea - it will not allow wrap tag text,when it's needed.
For second HTML we'll have to have additional changes
1 In CSS
a)
Code: Select all
.serendipity_freeTag_xmlTagEntry {
white-space: pre; /*nowrap can't be redefined in internal span*/
}
(container for xml-button and text, provide no-widow xml-button instead of nbsp)
b) for 2 from 3 themes I had to add
Code: Select all
.serendipity_freeTag_xmlButton {
border: none;
}
otherwise xmlbutton got border around
2. Wrapping of tag text we'll get with inline styling of span by white-space: normal and using spaces instead of nbsp (str_replace on str. 607 of serendipity_event_freetag.php)
Full path for event_freetag inline
Code: Select all
--- D:/Sites/mayorat.e-city.net.ru/web/blog/plugins/serendipity_event_freetag/serendipity_event_freetag.php Пн май 9 10:19:30 2011
+++ Z:/serendipity_event_freetag.php Пт июн 3 15:26:06 2011
@@ -584,7 +584,7 @@
if ($xml) {
$html .= '<span class="serendipity_freeTag_xmlTagEntry"><a rel="tag" class="serendipity_xml_icon" href="' . $rsslink . urlencode($name) . '" title="' . htmlspecialchars($name) . '">'.
- '<img alt="xml" src="' . $xmlImg . '" class="serendipity_freeTag_xmlButton" /></a> ';
+ '<img alt="xml" src="' . $xmlImg . '" class="serendipity_freeTag_xmlButton" /></a> ';
}
if ($scaling) {
@@ -599,12 +599,12 @@
} else {
$fontSize = round(($quantity - $smallest)*(($maxSize - $minSize)/($scale))) + $minSize;
}
- $html .= '<span class="tag_weight_' . $fontSize . '" style="font-size: '. $fontSize .'%">';
+ $html .= '<span class="tag_weight_' . $fontSize . '" style="font-size: '. $fontSize .'%; white-space: normal;">';
} else {
$fontSize = 100;
}
- $html .= '<a rel="tag" href="' . $taglink . serendipity_event_freetag::makeURLTag($name) . '" title="' . htmlspecialchars($name) . ($quantity > 0 ? ' (' . $quantity . ') ' : '') . '">' . str_replace(' ',' ',htmlspecialchars($name)) . '</a>';
+ $html .= '<a rel="tag" href="' . $taglink . serendipity_event_freetag::makeURLTag($name) . '" title="' . htmlspecialchars($name) . ($quantity > 0 ? ' (' . $quantity . ') ' : '') . '">' . htmlspecialchars($name) . '</a>';
if ($scaling) {
$html .= '</span>';
and attached
Re: TagCloud block view
Posted: Fri Jun 03, 2011 4:00 pm
by garvinhicking
Hi!
Ok, I've committed your patch! Thanks!
Regards,
Garvin