vb.org Archive - Miscellaneous Hacks - Add additional

Page 1 of 3

Show 40 post(s) from this thread on one page

vb.org Archive (https://vborg.vbsupport.ru/index.php)

- vBulletin 4.x Add-ons (https://vborg.vbsupport.ru/forumdisplay.php?f=245)

- - Miscellaneous Hacks - Add additional_css.css to all your pages (https://vborg.vbsupport.ru/showthread.php?t=228628)

Lynne

11-21-2009 10:00 PM

Add additional_css.css to all your pages

1 Attachment(s)

Instead of finding the template.css file to edit the .css properties for your pages, just put them all in this additional_css.css template. The additional_css.css file is linked right before the </head> in your page. This is for use until this is made standard in the vb product (I put in a bug report requesting this be included - Please consider adding user defined Additional CSS to pages).

Version History:
1.0 2009-11-22: - initial release by Lynne at vbulletin.org
1.1 2009-12-08: - fixed issue with style dateline not showing up. Fixed & issue (changes to &). added additional2_css.css file so the first additional_css file can be used in the parent style and then additional2_css used in the child styles.

Notes - if you only want this included on certain pages, then you may open the plugin "Add addition_css.css file to pages" and put a condition around it, such as (this is for just the index page and the showthread page):

PHP Code:


		
			
if (in_array(THIS_SCRIPT,array('index','showthread'))) {

all the code currently in the plugin

}

.
.
To install:

1. Import product-product-lynne_add_css.xml
2. Add any additional css you want to add to the page in your additional_css.css template.

To uninstall:

1. Uninstall "Add additional css to your style"

Please mark Installed if you use this.

HMBeaty

11-22-2009 05:32 PM

Well, definately alot easier than I just did it. haha! Thanks Lynne

Charlie98902

11-22-2009 05:33 PM

This has unlimited potential to as I think if you make the css just right you can have it set to show usergroup html markup everywhere on your site?

bobster65

11-22-2009 05:34 PM

brilliant Lynne! Thank you ;)

Charlie98902

11-22-2009 05:43 PM

Tagged for gold release. :) Added to your projects reply as well :)

TimberFloorAu

11-22-2009 06:29 PM

Excellent, also added to our Gold release products.

Ste

Fr4n-FX

11-22-2009 07:20 PM

wow this is fantastic, i will try later. thank you!

but what happen if i have ".forum" for explame in both css files? what file have "preference" :/

Lynne

11-22-2009 07:46 PM

Quote:

Originally Posted by Fr4n-FX (Post 1919108)

wow this is fantastic, i will try later. thank you!

but what happen if i have ".forum" for explame in both css files? what file have "preference" :/

You should read up on how Cascading Style Sheets work in order to understand the answer to that question. I put this file as the very last .css file to be linked in the <head> section for a very good reason - so it is the LAST .css file to be included. If you include inline CSS or style info in the <body>, then you can 'overwrite' the styling info in this file, but this file should 'overwrite' any styling info in the previous stylesheets if it is written correctly.

TheLastSuperman

11-22-2009 08:16 PM

Very... VERY nice Lynne - THANKS :D

Jurhum

11-22-2009 08:45 PM

I understand we can use this to style our websites instead of using stylevars. However, when i try to change anything using this template it does not over ride the orginal css settings. Can you provide a brief example of how to change anything using this template? such as text color or anything else. thank you in advance

Lynne

11-22-2009 09:01 PM

It is not really to be used to style instead of stylevars. It is used to add additional css without having to edit the actual .css template that has the .css in it. You may need to do a Force Refresh on your page to get the edited version of this file read after you change it.

Jurhum

11-22-2009 10:09 PM

so we can't use this to over ride the orginal setting in a style?

Lynne

11-22-2009 10:26 PM

Yes, you can use this to override the original settings in a style. You may use stylevars in it though, if you want. It's just another .css file, but since it is the last one, if you do your styling correctly, you may override the original style settings.

Dr.osamA

11-22-2009 11:33 PM

try try try
________
Xxx Movies Online

KrU$ty

11-23-2009 06:00 AM

Thanks. A very needed mod that should be a standard in vb4.

The Wise One

11-23-2009 09:03 AM

exactly what i was looking for. had mine in headinclude but it was getting loaded before a couple of stylesheets, making it necessary to still edit some css templates. thanks for the release. installed.

fourat

11-23-2009 12:00 PM

Thank you Lynne
I hope adding standard additional CSS to VB 4 .. So as to become perfect and useful version
The stylevars system now imperfect

SİMAR

11-23-2009 03:58 PM

thanks

Rene Kriest

11-30-2009 01:44 PM

Kudos to Lynne. Good proposal. This will help designers like me alot. Thx. :)

yaghoub

11-30-2009 02:38 PM

thanks lunne its very good for edite tempelat

alfanni

12-06-2009 05:12 PM

Excellent. This is a missing feature in VB4.
Thanks for sharing.

anthony parsons

12-08-2009 01:04 AM

Well Lynne, I have to say... so simple, yet so required. Not looking at the stylevars until beta5, and just today at that, and now finding how ridiculously impracticable the new stylevars system currently is, or the basic level it is at, this is an absolute requirement. Just looking into all the css files now included within the template system to achieve the layout, I discovered today how impracticable it all currently is. With coming upgrades, if I had to modify each template css, it would make future upgrades a near impossible task having to custom code each file again as no doubt the css template files will be constantly changing in revisions with a css layout. Some of the stupidity I am finding with the attempts of one stylevar and replicating it across multiple aspects of the suite... absolutely stupid IMHO.

Installed and thank you. Makes it much simplier that you have done it vs. me having to write one for my own use.

Thanks.

anthony parsons

12-08-2009 03:20 AM

This doesn't work in beta5.... The file actually writes correctly in the acp but doesn't seem to transcend to to the frontend. All you get at the frontend is the default first two lines of text, no actual css data.

Lynne

12-08-2009 04:10 AM

Quote:

Originally Posted by anthony parsons (Post 1927118)

Are you entering the css into the correct style? This is still working just fine for me on both my forums only test site and my suite test site.

mtha	12-08-2009 04:21 AM

Quote:

Originally Posted by anthony parsons (Post 1927118)

it might be related to the combination of styleid and langid too. i have two languages, and the correct edited css only appear when langid=1, or remove langid, so i removed langid from the path where calling the css. not sure why it is yet.

anthony parsons

12-08-2009 05:27 AM

Hey Lynne... Pretty sure. Adding css into ACP > Styles & Templates > Style Manager > Edit Templates > additional_css.css

I might try it on a clean install of beta5 I have, as I used it on an upgraded beta5 install. See if any difference exists.

anthony parsons

12-08-2009 05:31 AM

Hmmm... just worked on clean install. My private test upgrade install though doesn't work... interesting. Ok, thanks for that. I will dig at it... as this is outside of your software.

Sarthek

12-08-2009 11:43 AM

tagged for gold

Lynne

12-08-2009 01:31 PM

Quote:

Originally Posted by mtha (Post 1927131)

This is interesting. I don't have other languages on my sites, so I haven't seen this happen. What does the url to the additional_css.css file look like in the situation where it isn't working?

I also modified this a bit for myself. I created another file additional_css2.css also. I use additional_css for css that I want in all my styles (so I 'fill' it in the parent style) and then use additional_css2 to make small changes to the child styles. Is anyone interested in that version of this?

mtha	12-08-2009 06:19 PM

Quote:

Originally Posted by Lynne (Post 1927259)

i dont have the forum on public accessible location, so cant give you the direct link, anyway

i have two language (1 and 2), and my styleid is 24.

when i install this, and my default language is 2, i have

/forum/css.php?styleid=24&langid=2&d=&sheet=additional_cs s.css

it only shows

PHP Code:


		
			
@charset "UTF-8";

/* Additional CSS */

when i change to language 1, or set direct link to langid=1, i see the additional CSS that i added to the template.

forum/css.php?styleid=24&langid=1&d=&sheet=additional_cs s.css

if i remove the langid, it also show the template correctly
forum/css.php?styleid=24&d=&sheet=additional_css.css

mtha	12-08-2009 06:38 PM

now the new version 1.1 doesnt have that problem anymore. it works great now, with langid. thanks

Lynne

12-08-2009 06:41 PM

Quote:

Originally Posted by mtha (Post 1927368)

when i install this, and my default language is 2, i have

/forum/css.php?styleid=24&langid=2&d=&sheet=additional_cs s.css

And yet the other stylesheets in the page also have langid=2 and they are fine?

I can't think of why it wouldn't work. I checked my file and the template is set to templatetype="template" just like the other .css templates in the style. I really don't know anything about the language system in vbulletin since I've never used it before. If someone has any suggestions on what to look at here, I'm welcome to listen.

edit: Oh, just read your last comment that it is now working fine. Perhaps it was the missing style date that was causing the problems? Not really sure, but if it's working, then I'm glad. :)

anthony parsons

12-08-2009 07:46 PM

It seems that a custom css is actually not needed, because you can enter custom css directly into the existing css templates, and when you upgrade between versions, the merge system takes any custom coding and merges it into the newer template being replaced with, hence why no current custom CSS solution is available within the templating / stylevars system.

Lynne

12-08-2009 08:18 PM

Yes, you can do that, but I find it easier to have all my changes in one place instead of having to search out the template to change things there.

anthony parsons

12-09-2009 03:37 AM

Hmmm... thanks Lynne. I asked Wayne about this also and he suggested to stick with this concept as well... being all custom css in the one place and not relying upon the merge ability of the system to get it right.

Deniz AKCANTAŞ

12-09-2009 07:50 PM

thanks

sam12345

12-10-2009 11:36 AM

Lynne you are genius..:up:

pneo	12-10-2009 02:52 PM

Thank you for the fantastic (and much needed!) Mod Lynne.

Please could you clarify the syntax needed in the additional CSS please?

If for example I want to edit width of the search area that is under the '.navbar_search' selector in vbulletin.css...

Quote:

Originally Posted by vbulletin-chrome.css

.navbar_search {
position:relative;
width:180px;
bottom: 1px;
{vb:stylevar right}: -{vb:math {vb:stylevar padding}*2};
display:block;
}

Do I need to 'call' the specific css file to overwrite it in additional.css or simply place...

Quote:

Originally Posted by additional.css

.navbar_search {
position:relative;
width:200px;
bottom: 1px;
{vb:stylevar right}: -{vb:math {vb:stylevar padding}*2};
display:block;
}

...and it should automatically overwrite the original (when I inspect the page after making this alteration there is no change it is only using vbulletin-chrome.css)?

This clarification may help others so I look forward to hearing your response - perhaps you could provide an example of the structure of the additional.css?

Thank you in advance.

Darkimmortal

12-10-2009 03:00 PM

As long as you use the same or a higher priority selector (more specific) than the original then you can simply overwrite properties.

Lynne

12-10-2009 04:31 PM

Quote:

Originally Posted by pneo (Post 1928384)

Do I need to 'call' the specific css file to overwrite it in additional.css or simply place...

Code:

.navbar_search {

        position:relative;

        width:200px;

        bottom: 1px;

        {vb:stylevar right}: -{vb:math {vb:stylevar padding}*2};

        display:block;

}

...and it should automatically overwrite the original (when I inspect the page after making this alteration there is no change it is only using vbulletin-chrome.css)?

You do not need to 'call' the file, just place the css in the template. In this particular case, since all you want to do is override the width property and leave the others alone, just add this to the .css template:

Code:

.navbar_search {

        width:200px;

}

All times are GMT. The time now is 06:11 PM.

Page 1 of 3

Show 40 post(s) from this thread on one page

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.01867 seconds Memory Usage 1,830KB Queries Executed 10 (?)
More Information
Template Usage: (1)ad_footer_end (1)ad_footer_start (1)ad_header_end (1)ad_header_logo (1)ad_navbar_below (2)bbcode_code_printable (2)bbcode_php_printable (9)bbcode_quote_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)pagenav (1)pagenav_curpage (2)pagenav_pagelink (1)post_thanks_navbar_search (1)printthread (40)printthreadbit (1)spacer_close (1)spacer_open Phrase Groups Available: global postbit showthread	Included Files: ./printthread.php ./global.php ./includes/init.php ./includes/class_core.php ./includes/config.php ./includes/functions.php ./includes/class_hook.php ./includes/modsystem_functions.php ./includes/class_bbcode_alt.php ./includes/class_bbcode.php ./includes/functions_bigthree.php Hooks Called: init_startup init_startup_session_setup_start init_startup_session_setup_complete cache_permissions fetch_threadinfo_query fetch_threadinfo fetch_foruminfo style_fetch cache_templates global_start parse_templates global_setup_complete printthread_start pagenav_page pagenav_complete bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: