vb.org Archive

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vBulletin 4.x Styles (https://vborg.vbsupport.ru/forumdisplay.php?f=247)
-   -   Suite Style - Avenger Blue Style by TheLastSuperman (https://vborg.vbsupport.ru/showthread.php?t=269253)

TheLastSuperman 01-20-2014 02:14 AM

Awesome!!! Glad to hear that because I spent my free time today finishing this up :p ;).

ozzy47 01-20-2014 02:17 AM

It is now set to the default style on my site if you want to see it somewhere else besides your testing environment.

I appreciate you finishing this up. :)

TheLastSuperman 01-20-2014 02:42 AM

Looking good! The only thing I noticed so far was how some of the toplinks shift slightly when hovering... that's a padding issue and I've corrected it in most of the links will get to that any day now and post a fix then include in revision :D.

ozzy47 01-20-2014 02:50 AM

Yeah not a big deal.
I also noticed when hovering over the subnavbar, the dropdowns don't change at all. Like hovering over the Quick Links, it does not change or alert that there is more info there, again no big deal.

ozzy47 01-20-2014 02:57 AM

1 Attachment(s)
I see I am going to have to optimize some images too.

Once I optimize them you want me to sent you them in a zip so you can add them you the style?

TheLastSuperman 01-20-2014 03:01 AM

Quote:

Originally Posted by ozzy47 (Post 2475466)
I see I am going to have to optimize some images too.

Once I optimize them you want me to sent you them in a zip so you can add them you the style?

That would be superb if you don't mind!

ozzy47 01-20-2014 03:53 AM

OK I will see what I can do when I get home from work tomorrow.

K4GAP 01-20-2014 07:23 AM

My birthday is coming up in mid Feb. :)

mitch84 01-20-2014 02:33 PM

1 Attachment(s)
where this?(template name) I can't see it, thx

crazyboy1661 01-20-2014 02:36 PM

Quote:

Originally Posted by ozzy47 (Post 2475466)
I see I am going to have to optimize some images too.

Once I optimize them you want me to sent you them in a zip so you can add them you the style?

Hello Ozzy47, I would like to know the way you are going to optimize the images. Once you have finished optimizing, just let me know the procedure. I too want to optimize the images for my site.

Thanks

mitch84 01-20-2014 04:03 PM

Quote:

Originally Posted by mitch84 (Post 2475548)
where this?(template name) I can't see it, thx

conflict with this hack(ozzy), if activated menu disappears

TheLastSuperman 01-20-2014 06:01 PM

Quote:

Originally Posted by mitch84 (Post 2475548)
where this?(template name) I can't see it, thx

header template, those are still the "toplinks" css ;).

Quote:

Originally Posted by mitch84 (Post 2475578)
conflict with this hack(ozzy), if activated menu disappears

Hmm checking this now stand by for more info.

ozzy47 01-20-2014 06:13 PM

Quote:

Originally Posted by mitch84 (Post 2475578)
conflict with this hack(ozzy), if activated menu disappears

Are you just using the style chooser in the navbar? Or do you have the language chooser as well?

TheLastSuperman 01-20-2014 06:15 PM

Quote:

Originally Posted by mitch84 (Post 2475578)
conflict with this hack(ozzy), if activated menu disappears

Ok so in the mod options ensure you have this set to no:

Quote:

Auto Deploy
Setting this to "Yes" will make the style & language selectors show in the navbar.

Set this to "No" to be able to use the variable, {vb:raw show.ozzmodz_style_lang_chooser} in your templates, to make it show where you want.
Then edit template ozzmodz_style_lang_chooser and find:
Code:

    <div style="margin-bottom:35px;">
Replace with:
Code:

    <div class="avbozzystyle">


Now in additional.css add this just below the .abimage css definition:
Code:

.avbozzystyle {
        float:right;
        clear:left;
        height:25px !important;
        background:transparent;
        margin-top:-25px !important;
        margin-right:45% !important;
}



Now in template header find:
Code:

                    <div class="ablogo">
<div class="abimage"><a name="top" href="{vb:link forumhome}"><vb:comment><img src="images/avenger_blue/misc/home.png" width="960px" height="150px" alt="{vb:raw vboptions.bbtitle}" /></vb:comment></a></div>
</div>

Replace with:
Code:

                    <div class="ablogo">
<div class="abimage"><a name="top" href="{vb:link forumhome}"><vb:comment><img src="images/avenger_blue/misc/home.png" width="960px" height="150px" alt="{vb:raw vboptions.bbtitle}" /></vb:comment></a></div>
{vb:raw show.ozzmodz_style_lang_chooser}
</div>



That should sort it ;).

ozzy47 01-20-2014 06:21 PM

Mike, is that something exclusive to your style?

TheLastSuperman 01-20-2014 06:25 PM

Quote:

Originally Posted by ozzy47 (Post 2475607)
Mike, is that something exclusive to your style?

I suppose so since the header and navbar have wrappers to do the height, background-image, borders etc - this is why I decided to have a look for mitch and just make it work then post a how-to ;).

Edit: Ahh so no, other styles unless they modified the header area the way I did should be just fine.

ozzy47 01-20-2014 06:26 PM

Ok cool, so I don't have to update my mod then, as this is the first I have heard of any issues.

TheLastSuperman 01-20-2014 06:33 PM

1 Attachment(s)
Quote:

Originally Posted by ozzy47 (Post 2475611)
Ok cool, so I don't have to update my mod then, as this is the first I have heard of any issues.

Nope it's good to go no changes required.

Hmm I want to redo the lastpostby to resemble this for Avenger Blue:

https://vborg.vbsupport.ru/attachmen...hmentid=147902

However that requires editing some phrases... perhaps I'll post a how-to on that later today after I catch up on some work ;).

mitch84 01-20-2014 06:43 PM

Quote:

Originally Posted by TheLastSuperman (Post 2475602)
Ok so in the mod options ensure you have this set to no:



Then edit template ozzmodz_style_lang_chooser and find:
Code:

    <div style="margin-bottom:35px;">
Replace with:
Code:

    <div class="avbozzystyle">


Now in additional.css add this just below the .abimage css definition:
Code:

.avbozzystyle {
        float:right;
        clear:left;
        height:25px !important;
        background:transparent;
        margin-top:-25px !important;
        margin-right:45% !important;
}



Now in template header find:
Code:

                    <div class="ablogo">
<div class="abimage"><a name="top" href="{vb:link forumhome}"><vb:comment><img src="images/avenger_blue/misc/home.png" width="960px" height="150px" alt="{vb:raw vboptions.bbtitle}" /></vb:comment></a></div>
</div>

Replace with:
Code:

                    <div class="ablogo">
<div class="abimage"><a name="top" href="{vb:link forumhome}"><vb:comment><img src="images/avenger_blue/misc/home.png" width="960px" height="150px" alt="{vb:raw vboptions.bbtitle}" /></vb:comment></a></div>
{vb:raw show.ozzmodz_style_lang_chooser}
</div>



That should sort it ;).

well done! all is ok now! thx:up:

TheLastSuperman 01-20-2014 06:47 PM

Quote:

Originally Posted by mitch84 (Post 2475618)
well done! all is ok now! thx:up:

Good to hear! Enjoy the style :D

Edit: *I also added these instructions in the 2nd post of the mod.

TheLastSuperman 01-20-2014 08:46 PM

ahh so ok on the optimizing images note, I found the option in my image editing program for .png it's "Posterize" here is a nifty bit of info too - http://www.smashingmagazine.com/2009...on-techniques/

How were you going to optimize the images Ozzy? I've only ever thought to optimize .jpg and .gif honestly using default options available not "posterize" so some of this is a little new to me.

ozzy47 01-20-2014 08:49 PM

I tried doing them all, but I can not get any better results from the page test, without screwing up some of the images. So I think they are fine just the way they are, I was just looking to speed up the page load but not if it is going to degrade the images.

TheLastSuperman 01-20-2014 09:18 PM

Hmm I optimized some others (not from this style) using posterize and one example took it from 1.46mb down to 1.05mb and the image looked fine I zoomed in a little as I noted that article said it clumps color regions together. I didn't notice any clumping using the value suggested of 40 but it could vary by image per their example of the image on the background (the image they showed w/ the little Earth globe) so I'll do this later on and simply check each image as I go and refresh the style each time.

If the image looks ok then it is optimized, even if just a little it still helps and if the image looks bad I will not modify the original ;).

ozzy47 01-20-2014 09:23 PM

Cool, cause me and graphics are like water and oil. :)

kandalf 01-20-2014 11:46 PM

First off, Very nice work you did !
Now i got a problem and cant find the solution anywhere.
I added my logo to it but your logo is still in the background, any idee's ?
http://godsgrace.the-remedy.be/

ozzy47 01-21-2014 12:24 AM

How is it that you added your logo? You should have changed the stylevar titleimage, found under the group, ImagePaths.

TheLastSuperman 01-21-2014 01:29 AM

Quote:

Originally Posted by kandalf (Post 2475665)
First off, Very nice work you did !
Now i got a problem and cant find the solution anywhere.
I added my logo to it but your logo is still in the background, any idee's ?
http://godsgrace.the-remedy.be/

See below...

Quote:

Originally Posted by ozzy47 (Post 2475679)
How is it that you added your logo? You should have changed the stylevar titleimage, found under the group, ImagePaths.

Correct ^ and thanks Ozzy.

The css for the header logo still references the stylevar "titleimage" ;).

Code:

.abimage {
        background: url({vb:stylevar titleimage}) center center no-repeat !important;
        height: 155px !important;
        margin-left: 0px !important;
}

Edit: Now that I took another minute to look at it, I realized you were simply trying to make the logo clickable as well, to do this simply edit template header...

Find:
Code:

                    <div class="ablogo">
<div class="abimage"><a name="top" href="{vb:link forumhome}"><vb:comment><img src="images/avenger_blue/misc/home.png" width="960px" height="150px" alt="{vb:raw vboptions.bbtitle}" /></vb:comment></a></div>
</div>


Fixed Width Replace with:
Code:

                    <div class="ablogo">
<div class="abimage"><a name="top" href="{vb:link forumhome}"><img src="images/avenger_blue/misc/home.png" width="960px" height="150px" alt="{vb:raw vboptions.bbtitle}" /></a></div>
</div>

Fluid Width Replace with:
Code:

                    <div class="ablogo">
<div class="abimage"><a name="top" href="{vb:link forumhome}"><img src="images/avenger_blue/misc/home.png" width="100%" height="150px" alt="{vb:raw vboptions.bbtitle}" /></a></div>
</div>


Now the logo is clickable.
*Additionally this utilizes a transparent image so anyone right-clicking to copy your logo will not be able to, they can still obtain the url via source code or firebug for example though.

crazyboy1661 01-21-2014 05:29 AM

Superb Style TheLastSuperman. Installed on our live board and it is absolutely nice. Rated 5.

kandalf 01-21-2014 10:34 AM

Thanks ! Fixt now !

ozzy47 01-21-2014 11:12 PM

Quote:

Originally Posted by TheLastSuperman (Post 2475698)
*Additionally this utilizes a transparent image so anyone right-clicking to copy your logo will not be able to, they can still obtain the url via source code or firebug for example though.

Say what? All they have to do is select View Background Image, when they right click, and then they can grab it from there, or am I missing something.

TheLastSuperman 01-22-2014 12:52 AM

Quote:

Originally Posted by ozzy47 (Post 2475865)
Say what? All they have to do is select View Background Image, when they right click, and then they can grab it from there, or am I missing something.

^ That is only if you do the edit to make the logo clickable. I did it so the titleimage var is used in the css in the background: definition so to make it clickable you remove the <vb:comment> code and the image it pulls is in fact a transparent image so if they right click they will be served up that image instead of the logo.

When I made this style I was thinking why make the logo clickable... we have the navbar it has a Forums tab it's right there on every page all the time but some do prefer it that way.

K4GAP 01-22-2014 08:18 PM

Any page that is long enough to make the side scroll bar appear, goes wide. (makes bottom scroll appear also).

I thought maybe I could fix it by cutting the background_top.png into narrow strips and change the appropriate code. That didn't work. I went to look at your demo and found that it is the same way. I'm running 1900x1080 resolution if that helps.

To get the desired affect of the glow in the original header, I used that same affect on the blue_avenger_logo.png. It all looks ok so I may suggest that rather than use that really wide header, use a 4 px wide one repeating instead. And place the affect on a blank logo with an additional psd file in your download. Or just make it optional.

TheLastSuperman 01-23-2014 02:51 AM

Quote:

Originally Posted by GaryT (Post 2476046)
Any page that is long enough to make the side scroll bar appear, goes wide. (makes bottom scroll appear also).

I thought maybe I could fix it by cutting the background_top.png into narrow strips and change the appropriate code. That didn't work. I went to look at your demo and found that it is the same way. I'm running 1900x1080 resolution if that helps.

To get the desired affect of the glow in the original header, I used that same affect on the blue_avenger_logo.png. It all looks ok so I may suggest that rather than use that really wide header, use a 4 px wide one repeating instead. And place the affect on a blank logo with an additional psd file in your download. Or just make it optional.

Actually the idea about the glow on a different image is on par, what a good suggestion because I had added css code before to remove the scrollbar in X but when I resized the browser it would not allow you to move about as-intended so I removed it before release.

So your idea will be in the next revision ;).

K4GAP 01-23-2014 03:36 AM

Quote:

Originally Posted by TheLastSuperman (Post 2476146)
Actually the idea about the glow on a different image is on par, what a good suggestion because I had added css code before to remove the scrollbar in X but when I resized the browser it would not allow you to move about as-intended so I removed it before release.

So your idea will be in the next revision ;).

Any idea how to get rid of the side scroll?

TheLastSuperman 01-23-2014 04:33 AM

Quote:

Originally Posted by GaryT (Post 2476162)
Any idea how to get rid of the side scroll?

Do me a favor? See if the Fluid Demo is now fixed for you i.e. no scroll bar at bottom and no extra space on right now when viewing in 1920x1080 and let me know. For me it's fixed but I'd like another set of eyes on it if you don't mind.

If it's now gone then I bloody well fixed it lol and will revise the fluid version tomorrow and release the update ;).

Edit: Ok onemore revision, now check it. @12:38am GMT-5.

glen290 01-23-2014 10:32 AM

Nice style, installed it today, have an issue though, the side blocks have scroll bars on them, how can I get rid of them ?

TheLastSuperman 01-23-2014 12:04 PM

That is related to how you've modified the sidebar to show quotes as well quotes, it has nothing to do with this style however let's see if I can't help :cool:.

Using the link in your signature and changing styles I now see the issue, it could simply be the stylevar for the sidebar width.

AdminCP > Styles & Templates > Style Manager > Style Variable Editor > *Scroll to find: Sidebar > In that family of stylevars edit the top one which is forum_sidebar_width

Try increasing it from 270 in increments of 5 i.e. next try 275 as width, keep saving and refreshing until the sidebar block scrollbars are gone. The issue is the content within the sidebar blocks is wider than the allowed size (based on current width of 270+padding) and therefor adding in the scrollbar to ensure all content is displayed.

Alternatively you can add this to additional.css which should adjust that custom div class you have going (showing the quotes as quotes in the sidebar is the actual area making it too wide), you can do this by editing additional.css and adding this at the very bottom:

Code:

.blockrow div.livewall_preview {
    margin-right: 6px;
}

margin-right is what we are adding here.

Let me know ;).

final kaoss 01-23-2014 03:46 PM

1 Attachment(s)
Here you go, saved you a bit of space with pnggauntlet.

TheLastSuperman 01-23-2014 07:31 PM

Quote:

Originally Posted by final kaoss (Post 2476284)
Here you go, saved you a bit of space with pnggauntlet.

I'll check these tonight and reply back once I do, should be good to go though and if so - THANKS :D.

K4GAP 01-23-2014 09:42 PM

Quote:

Originally Posted by TheLastSuperman (Post 2476176)
Do me a favor? See if the Fluid Demo is now fixed for you i.e. no scroll bar at bottom and no extra space on right now when viewing in 1920x1080 and let me know. For me it's fixed but I'd like another set of eyes on it if you don't mind.

If it's now gone then I bloody well fixed it lol and will revise the fluid version tomorrow and release the update ;).

Edit: Ok onemore revision, now check it. @12:38am GMT-5.

Your sites fluid version looks good now. I don't run the fluid version. I'm in no hurry. The Grandkids are still here for a few more days so I can't spend much time on the pc anyway :)


All times are GMT. The time now is 04:27 PM.

Powered by vBulletin® Version 3.8.12 by vBS
Copyright ©2000 - 2025, vBulletin Solutions Inc.

X vBulletin 3.8.12 by vBS Debug Information
  • Page Generation 0.01787 seconds
  • Memory Usage 1,860KB
  • 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
  • (15)bbcode_code_printable
  • (21)bbcode_quote_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (4)pagenav_pagelink
  • (1)pagenav_pagelinkrel
  • (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