vb.org Archive - Miscellaneous Hacks - Arrow Image next to posted links

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 Template Modifications (https://vborg.vbsupport.ru/forumdisplay.php?f=246)

- - Miscellaneous Hacks - Arrow Image next to posted links - Wiki style. (https://vborg.vbsupport.ru/showthread.php?t=259978)

AURFSCAN

03-06-2011 10:00 PM

Arrow Image next to posted links - Wiki style.

1 Attachment(s)

This is a really neat mod I just figured out :p

While messing around with another mod I just posted https://vborg.vbsupport.ru/showthread.php?p=2170434 I worked out how to add an Image after links in posts and sigs.

Image in this example is a small arrow - see attached Image

add to additional.css

Code:



.signature a { 

  margin: 0px;

  padding-right: 15px;

  background-image: url('/images/link1.gif');

  background-position:right center;

    background-repeat: no-repeat;



}

.postcontent a { 

  margin: 0px;

  padding-right: 15px;

  background-image: url('/images/link1.gif');

  background-position:right center;

    background-repeat: no-repeat;



}

change the url to point to your Image location

.postcontent arrow image will apply itself to attachment and quote boxes too :)

also you dont have to have them both (post link and sig link Images) , just add what you want

remove Image from Internal links - see post 18

:D

sulasno

03-07-2011 06:17 AM

tagged and thanks;
is it possible to put the arrow in front of the link?

AURFSCAN

03-07-2011 06:25 AM

sure sulasno, change in the code both 'right' to 'left'

eg.

Code:



.signature a { 

  margin: 0px;

  padding-left: 15px;

  background-image: url('/images/link1.gif');

  background-position:left center;

    background-repeat: no-repeat;



}

.postcontent a { 

  margin: 0px;

  padding-left: 15px;

  background-image: url('/images/link1.gif');

  background-position:left center;

    background-repeat: no-repeat;



}

sulasno

03-07-2011 06:45 AM

thanks

my present code is

Code:

/* change link color in posts */

.postcontent a {

[HERE]

font-weight: bold;

color: #FF0000;

[THERE]

}

where do I add your code ? [HERE] or [THERE]

AURFSCAN

03-07-2011 07:08 AM

easy just to add it underneath :)

Code:



/* change link color in posts */

.postcontent a {

[HERE]

font-weight: bold;

color: #FF0000;

[THERE]

}





.signature a { 

  margin: 0px;

  padding-left: 15px;

  background-image: url('/images/link1.gif');

  background-position:left center;

    background-repeat: no-repeat;



}

.postcontent a { 

  margin: 0px;

  padding-left: 15px;

  background-image: url('/images/link1.gif');

  background-position:left center;

    background-repeat: no-repeat;



}

but this will work aswell

Code:



/* change link color in posts and add Image*/

.postcontent a { 

  font-weight: bold;

  color: #FF0000;

  margin: 0px;

  padding-left: 15px;

  background-image: url('/images/link1.gif');

  background-position:left center;

    background-repeat: no-repeat;



}





.signature a { 

  margin: 0px;

  padding-left: 15px;

  background-image: url('/images/link1.gif');

  background-position:left center;

    background-repeat: no-repeat;



}

Taurus1

03-07-2011 07:53 AM

Now that is so cool man. Thanks! Looks great.

Boofo

03-07-2011 08:15 AM

I'm confused here. Why would you want to add an arrow image to a link if it doesn't lead anywhere? That is what the arrow image is used for in posts.

Taurus1

03-07-2011 08:24 AM

Quote:

Originally Posted by Boofo (Post 2170503)

I'm confused here. Why would you want to add an arrow image to a link if it doesn't lead anywhere? That is what the arrow image is used for in posts.

HUH? The arrow is right behind the link, so clicking it takes you to where the link goes. To me, it makes links stand out a bit more in posts. Looks good.

sulasno

03-07-2011 08:55 AM

I have installed it but I can't see the image using Palemoon; going to trying using another browser; personally I prefer a dancing girl instead of an arrow :-)

Boofo

03-07-2011 09:16 AM

Quote:

Originally Posted by Taurus1 (Post 2170505)

HUH? The arrow is right behind the link, so clicking it takes you to where the link goes. To me, it makes links stand out a bit more in posts. Looks good.

If the arrow takes you to the same place the link goes, then clicking the link or using the arrow is the same thing? That is kind of ambiguous, don't you think? To each their own, I guess.

All times are GMT. The time now is 08:07 AM.

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.01068 seconds Memory Usage 1,738KB 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 (5)bbcode_code_printable (2)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 (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
Messages: