vb.org Archive - How to add image to Usergroup markup?

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

- vB4 General Discussions (https://vborg.vbsupport.ru/forumdisplay.php?f=251)

- - How to add image to Usergroup markup? (https://vborg.vbsupport.ru/showthread.php?t=314035)

Elixar

08-30-2014 11:07 PM

How to add image to Usergroup markup?

Like this?

https://vborg.vbsupport.ru/external/2014/08/3.png

I did it with the HTML IMG tags, but when I try to add a space to it, it won't work.

tbworld

08-30-2014 11:12 PM

You will need to show your code so we can see what you are doing or pass a usable link. :)

Elixar

08-30-2014 11:21 PM

As far as the markup I'm using?

tbworld

08-30-2014 11:25 PM

Quote:

Originally Posted by Elixar (Post 2513174)

As far as the markup I'm using?

Yes, please.

Or a link to the page. We can pull the markup and CSS from there. :)

Elixar

08-30-2014 11:36 PM

I added it and it works:

<img src="http://wwwlinkher.com/jpg" border="0">

However when I go to my profile, the A goes to the left of my name.

tbworld

08-31-2014 12:11 AM

I am sure your CSS is incorrect, for what you are trying to do.
Sorry, I really cannot help without more information or a link to this page on your site. :(

Elixar

08-31-2014 02:29 AM

Quote:

Originally Posted by tbworld (Post 2513181)

I am sure your CSS is incorrect, for what you are trying to do.
Sorry, I really cannot help without more information or a link to this page on your site. :(

I've PM'ed you the link. :)

tbworld

08-31-2014 03:12 AM

Give this a try. :)

Add to the bottom of your "additional.css" template in your correct style.

Code:

/* Position Username Indicator */

.postbitlegacy .userinfo .username_container img {

    margin-left: 5px;  /* Adjust Accordingly */

}



/* Position On-line Status Indicator */

img.onlinestatus {

  left: 8px;

  top: 5px;

}

Elixar

08-31-2014 03:14 AM

I don't believe that anything has changed. :confused:

tbworld

08-31-2014 03:17 AM

Quote:

Originally Posted by Elixar (Post 2513192)

I don't believe that anything has changed. :confused:

You may have grabbed the wrong information, as I first posted the wrong CSS. Compare my post to your "additional.css" entry. I have already tested it on your board, it should work.

Elixar

08-31-2014 03:20 AM

I see that the A has moved in the thread locations, but it lacks the space in Who's Online, and is on the left side on the profile. Also, the online indicator is like super out there. :D

tbworld

08-31-2014 03:20 AM

The above CSS is for the "Postbit" template. I Just looked at your board and it is already applied.

Elixar

08-31-2014 03:23 AM

Quote:

Originally Posted by tbworld (Post 2513195)

The above CSS is for the "Postbit" template. I Just looked at your board and it is already applied.

It is, but I'm also looking for the space to be applied in all cases if it's possible.

tbworld

08-31-2014 03:45 AM

Where did you apply the img tag universally to the username?

--------------- Added 30 Aug 2014 at 22:59 ---------------

This might work. :)

Add to the bottom of your "additional.css" template in your correct style.

Code:

/* Position Username Indicator */

.postbitlegacy .userinfo .username_container img,

.username img {

    margin-left: 5px; 

}



/* Position On-line Status Indicator */

img.onlinestatus {

  left: 8px;

  top: 5px;

}

Elixar

08-31-2014 10:30 AM

It does work, just one last thing:

This is happening on the profile:

https://vborg.vbsupport.ru/external/2014/08/1.png

tbworld

08-31-2014 03:49 PM

Added selector for "member profile".

Add to the bottom of your "additional.css" template in your correct style.

Code:

/* Position Username Indicator */

.postbitlegacy .userinfo .username_container img,

.username img,  .member_username {

    float: none; margin-left: 5px; 

}



/* Position On-line Status Indicator */

img.onlinestatus {

  left: 8px;

  top: 5px;

}

Elixar

09-01-2014 02:04 AM

Hey dude, thanks so much for your help. Unfortunately it looks like it didn't change sadly. :(

tbworld

09-01-2014 03:16 AM

This should do it. :)

Code:

/* Position Username Indicator */

.postbitlegacy .userinfo .username_container img,

 .username img,

 #sidebar_container.member_summary .blocksubhead img {

    float:none;  margin-left:5px; 

}



/* Position On-line Status Indicator */

img.onlinestatus {

  left:8px;  top:5px;

}

Elixar

09-01-2014 06:42 PM

Awesome, it works. Question though, how do you get it to when you hover over the image, it says Admin?

tbworld

09-01-2014 08:29 PM

This is done by adding text to the "title" attribute of the element in which you want the tooltip to appear.

For example on "your" postbit template:

Code:

  / * Elongated for clarity -- Not actual code as the  "// comment" is not HTM, and should be removed */

  <span 

     title  = "Administrator"    // Add the text "Administrator" as tool-tip

     style = "color:#FF0000;"> 

        <b>Elixir</b>

  </span>

In reality you will wish to use a template variable to report information via a tooltip.

See ... for reference:
http://www.w3schools.com/tags/att_global_title.asp

Elixar

09-09-2014 11:42 PM

Quote:

Originally Posted by tbworld (Post 2513423)

This is done by adding text to the "title" attribute of the element in which you want the tooltip to appear.

For example on "your" postbit template:

Code:

  / * Elongated for clarity -- Not actual code as the  "// comment" is not HTM, and should be removed */

  <span 

     title  = "Administrator"    // Add the text "Administrator" as tool-tip

     style = "color:#FF0000;"> 

        <b>Elixir</b>

  </span>

In reality you will wish to use a template variable to report information using a tooltip.

See ... for reference:
http://www.w3schools.com/tags/att_global_title.asp

Um whodawut. :D

Elixar

09-13-2014 10:35 PM

Bump.

tbworld

09-13-2014 10:41 PM

Quote:

Originally Posted by Elixar (Post 2514463)

Um whodawut. :D

I have no idea what this means, sorry :(

ozzy47

09-13-2014 11:04 PM

He means he has no clue what you are talking about. :)

tbworld

09-13-2014 11:17 PM

Quote:

Originally Posted by ozzy47 (Post 2515095)

He means he has no clue what you are talking about. :)

Thanks @Ozzy47, I have never been a slang guy. I guess that is obvious now. :)
He should re-ask his question, and/or what part he didn't understand as I do not know how to assist him at this point.

The question was "How do you", not "can you do this for me", but maybe he wanted the later. Clarity on the question would help. :)

All times are GMT. The time now is 03:49 PM.

X vBulletin 3.8.12 by vBS Debug Information
Page Generation 0.01933 seconds Memory Usage 1,765KB 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 (6)bbcode_code_printable (7)bbcode_quote_printable (1)footer (1)gobutton (1)header (1)headinclude (6)option (1)post_thanks_navbar_search (1)printthread (25)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 bbcode_fetch_tags bbcode_create bbcode_parse_start bbcode_parse_complete_precache bbcode_parse_complete printthread_post printthread_complete
Messages: