solved: various styled html_nugget_plugins

[sph]

okay, got a bad start with my last 'question', but by now i found something i really can't understand

it's about the html-plugin on the sidebar. i managed to change the design of these areas by using:

(...) _serendipity_html_nugget_plugin {...}


that works, of course - but that works for all html-plugins on the sidebar. now i try to find a way to change the view of a single area: is this possible? is there anything to specify each html-area for itself?

at the plugin-settings, i can use two terms to name an area: first the title, second a so-called 'further info-text' - is this something which could be important here?

any help welcome,

have a nice day!

[Col. Kurtz]

the further info text is shown in the plugin menu to be able to seperate different html nuggets from each other in case you use more than one.

[sph]

the further info text is shown in the plugin menu to be able to seperate different html nuggets from each other in case you use more than one.

yes, thats what the declaration says - but i'm anyway not able to find the matching css-tag. the complete element-tag is, as far as i know:

div.serendipitySideBarItem.container_serendipity_html_nugget_plugin



that's where i added some css, works fine to style the area in the sidebar. so, i'm using two of these html-nuggets, both with the same look, that's okay so far.

but now i have this idea to add a few more things to the sidebar, best way - to me - would be a third html-area, but this one needs to be different to the others or my idea won't come true and then i'll have to stop thinking about it. sad thoughts.

with the element-tag above i only can set all html-nuggets at once, and now again the question: is there any way to declare a single area? i guess it could be something addet at the end like "#nuggget_1" or something, but guessing will not work...

[garvinhicking]

Hi!

Usually, each html nugget plugin has its unique ID that you can use. But that might depend on the template. Which one are you using, what's your URL?

Best regards,
Garvin

[sph]

uh - template?

hm. except some .tpl's and some .css i'm using the default theme, i think - the files i changed are in myown template folder, so... i guess the default theme is the one my blog is based on.

well, see for yourself - new look not finished yet, so excuse the missing header and so on:

http://blog.plastick.org


to pick the element-id's i just use a firefox-plugin, "web developer toolbar" - easy way to find the tags



and, by the way: if you're looking at the page, could you answer another question?
there should be a background-image on the top-right of each entry, matching to the underline of the date/time.

depending on which computer i'm on i have troubles to set the colors right. the problem here are the monitor settings. some are too bright, you just can't see any bg-pic there, some are too dark, looks nearly like black then.

so i've tried to find a good middle-way - can you tell me what you think about it? is it okay? or should it be a little darker?

thanxalot, greets!

[judebert]

Can't you just add a defining <div id="whatever"> wrapping the other HTML in your nugget? Then you can style that, instead of the template-provided nugget wrapper.

[sph]

Can't you just add a defining <div id="whatever"> wrapping the other HTML in your nugget?

hm. you know how it feels if you have an idea and you just have to try to manage?

this div would be no problem to style - but this div would be inside of the html-block, too. means i'll have a div which could satisfy me, but around this div-area the nugget is shown, with its colors, borders, titles, ...

because of i'm using things like margin, padding and so on on the html-nugget-css, i don't believe it's able to style the div so that nothing else would be shown. but maybe i'm wrong here? guess i should try this, using negative margins and stuff.... *noticed*


uh, well... thought this is just a simple problem, thought i was just unable to find the tag to specify... but.... hm. i'm afraid i have to think about other solutions... i don't want to.... but... what else to do?


any ideas to put some content in a sidebar without these nugget-things?


thanx a very lot for your time, yout thoughts about this and your suggestions!


of course, the final solution is welcome anytime


-------


UPDATE:

okay, styling a 'div' inside of the html-nugget would not work.

negative margins works fine with the firefox, but forget to manage this in the IE. don't know what all the other browsers do.
workarounds, hacks, using the browser-own bugs is _no_ option, to me.

damn.

still hoping and waiting for help,

nice days, nice weekend!

[garvinhicking]

Hi!

I think the easiest solution is this:

Go and edit your "sidebar.tpl" template file. There must be something like this:

Code: Select all

{foreach from=$plugindata item=item}
    <div class="serendipitySideBarItem container_{$item.class}">
        {if $item.title != ""}<h3 class="serendipitySideBarTitle {$item.class}">{$item.title}</h3>{/if}
        <div class="serendipitySideBarContent">{$item.content}</div>
    </div>
{/foreach}

replace it with this:

Code: Select all

{foreach from=$plugindata item=item}
    <div id="{$item.id|replace:'@':''|replace:':':''}" class="serendipitySideBarItem container_{$item.class}">
        {if $item.title != ""}<h3 class="serendipitySideBarTitle {$item.class}">{$item.title}</h3>{/if}
        <div class="serendipitySideBarContent">{$item.content}</div>
    </div>
{/foreach}

As you can see, I added an "id" container which should identify every single plugin with a CSS ID...

HTH,
Garvin

[sph]

mmmmmh, delicious!


this is _great_ ! very _great_!


thanks, garvin!
you made my day


isn't this something which can quickly and easily be included in upcoming versions? just guessing, .css is something much people understand, .tpl not really

problem solved, great support here!

so, goin on - i'm sure there will be further questions. i'll be back...

[garvinhicking]

Hi!

Great you like it It *could* be added to upcoming versions, but actually it'S just more redundancy in the Themes and not needed in reality. If you need it, you can easily customize your own theme, but I'd like to not have this overhead in by default. s9y already pollutes the DIV class/id namespace too much, so I'd like to keep it low-profile at least as of now.

Best regards,
Garvin

[sph]

Hi!
... but I'd like to not have this overhead in by default. s9y already pollutes the DIV class/id namespace too much, so I'd like to keep it low-profile at least as of now.

yeah. well, thats why i am the user and you the developer - you're thinking about solutions for everyone

cheers&beers!