vb.org Archive

vb.org Archive (https://vborg.vbsupport.ru/index.php)
-   vB4 Design and Graphics Discussions (https://vborg.vbsupport.ru/forumdisplay.php?f=253)
-   -   How do I make this postbit alteration? (https://vborg.vbsupport.ru/showthread.php?t=259251)

troykp 02-22-2011 07:10 AM

How do I make this postbit alteration?
 
Hello,

I'm looking to add a background image to my postbit, as shown here (the black background):

https://vborg.vbsupport.ru/external/2011/02/15.png

Which HTML adjustments would I need to make in order to do this?

Much appreciated!

Edit: I tried adding a table to my postbit legacy and it merely disrupted the post area. I'm stumped. :p

Lynne 02-22-2011 04:29 PM

Have you tried adding it to stylevar "postbit_userinfo_background"?

troykp 02-23-2011 08:01 AM

Thanks for the response Lynne.

I tried that and I'm still having difficulties with the image; whilst I can now get an image in the background, it doesn't really work too well due to the different sizes of people's postbit user info panels.

Example: I have a favourite teams user profile field. It displays at the bottom of my postbit as images (very similar to the screenshot above). Some people use this field, some don't. As a result, they have different size postbits, which causes the background image to either be A) too short, or B) too long, and get cut off at the bottom.

The site in the screenshot I posted seem to have got round this error. Any ideas how? :)

Lynne 02-23-2011 04:58 PM

Can you post a link for us to see what you've done and the problems you see?

troykp 02-23-2011 08:56 PM

https://vborg.vbsupport.ru/external/2011/02/11.png https://vborg.vbsupport.ru/external/2011/02/12.png

^ As you can see, the results are vastly different. The first image cuts off short of the country flag, and sports teams, whilst the other comfortably contains it all. Avatar height, and the use/non-use of the favourite teams field means that I have different size postbits.

(ignore the odd looking images against the black background, I just put the black there to highlight what I mean)

The other forum I'm looking to follow the example of doesn't have that problem.

Lynne 02-23-2011 10:10 PM

It's really hard to tell what is going on without actual links. A link to the original site that has this working and a link to your site where it isn't working would allow us to see what is wrong.

troykp 02-23-2011 10:29 PM

http://www.wrestlingsmarks.com/ < - my site (although I've taken the background away so that the forum can still be used easily. All I'd done was add my image to postbit_userinfo_background).

http://wrestlingclique.com/ < - the site where they have this working properly.

Thanks for your assistance with this Lynne.

Lynne 02-23-2011 10:42 PM

That site actually does some other changes. They have one div for the whole userinfo. Then inside that, a top image, then a div with all the text userinfo text and a background image is used here repeated in the y direction, then a bottom image. So, that is how they get it to expand to any size. So, you would need to modify your postbit_legacy template in order to achieve what they have done.
HTML Code:

<div class="userinfo">
<top image centered>
<div class="newclass"> all stuff from div class userinfo now put into here </div>
<bottom image centered>
</div>

and then have a background image for .newclass

troykp 02-23-2011 11:51 PM

Thank you for finding that out Lynne. :)

I'm very nearly there, there's just one final question I have; how do I assign a background to .newclass? I'm not entirely sure how these <div> wrappers work!

Thanks again.

TheLastSuperman 02-24-2011 12:23 AM

Quote:

Originally Posted by troykp (Post 2166049)
Thank you for finding that out Lynne. :)

I'm very nearly there, there's just one final question I have; how do I assign a background to .newclass? I'm not entirely sure how these <div> wrappers work!

Thanks again.

Hmm to keep it within the example given...

Code:

<div class="newclass">
Code
Code
Code
</div>

So to use that and have it know what the css does you need to add this to additional.css i.e.

Code:

.newclass {
background: #000000 url(images/myimage.png) no-repeat;
}

Now be sure to change the #000000 to the value for the background color you want and change the image location to reflect the image you uploaded or want to use and yes you can use http://www.site.com/thierimage.png) instead of image/ etc.

OR you could use this w/o assigning a color:

Code:

.newclass {
background-image: url(images/myimage.png);
background-repeat: no-repeat;
}

Something along those lines... basically your making up definitions that contain how something is styled, you make/paste the definitions in additional.css because the site runs it last out of all the css templates this way your code knows how it's styled follow?

:cool:.

Edit: also have you seen these simple mods?

https://vborg.vbsupport.ru/showthread.php?t=229487
https://vborg.vbsupport.ru/showthread.php?t=235041


All times are GMT. The time now is 01:28 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.01088 seconds
  • Memory Usage 1,746KB
  • 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
  • (3)bbcode_code_printable
  • (1)bbcode_html_printable
  • (1)bbcode_quote_printable
  • (1)footer
  • (1)gobutton
  • (1)header
  • (1)headinclude
  • (6)option
  • (1)pagenav
  • (1)pagenav_curpage
  • (1)pagenav_pagelink
  • (1)post_thanks_navbar_search
  • (1)printthread
  • (10)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