BB Code Enhancements - BritePic BBCODE (Monetize and bring life to your images)

**************veenuisthebest*****************
*************Visit Tech6.com***************

Just found it while surfing the web. Its an AdBrite technology. Check out the demo here.
http://www.britepic.com/

What is BritePic?

• BritePic adds interactivity and ads (if you want them) to the photos on your website.
• BritePic is free and easy to use.

What kind of interactivity?

BritePic adds the following features to the images on your website:

• Email this image
• Link to this image
• Embed this image (you still get the ad revenue, even if your pic is embedded elsewhere)
• Zoom in and out
• Captions that slide out when you hover over the pic
• Ads from AdBrite
• Link the image to another URL
• Subscribe to RSS
• Rate this image (coming soon)
• View gallery (coming soon)
• Discuss this image (coming soon)
• Accessibility features for visually impaired (coming soon)
• And more?

1. All you need to do is to register with AdBrite for this free service.

2. Now go to admincp->BBCODE Manager->Add New BBCODE

Title:- BritePic
Tag:- britepic
Replacement:-

<script>
 britepic_id="Your unique BritePic ID";
 britepic_src="{param}";
</script>
<script src="http://www.britepic.com/britepic.js"></script>
<noscript>
<img src="{param}">
</noscript>

Example:- [britepic]URL to your example image[/britepic]
Description:- Allow users to add BritePics to their posts.

Rest leave default and Save.

Do not forget to put your BritePic ID in the Replacement code above.

3. DONE

Limitations:-

• Currently allows Jpegs only.
• Images smaller then 355px wide and 110px tall will not show ads.

LIVE DEMO

Do not forget to Mark as Installed if you find it useful..

[M-Tuning]

Originally Posted by Milad

You may say 'thank you for the tip' to me.

I already knew where to edit, it was redraider who made the tip , but thanks for the XHTML 1.0 Transitional code.

[cosy]

/** * vBulletin 3.7.2 CSS * Style: 'Default Style'; Style ID: 1 */ body { background: #E1E1E2; color: #000000; font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; margin: 5px 10px 10px 10px; padding: 0px; } a:link, body_alink { color: #22229C; } a:visited, body_avisited { color: #22229C; } a:hover, a:active, body_ahover { color: #FF4400; } .page { background: #FFFFFF; color: #000000; } td, th, p, li { font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; } .tborder { background: #D1D1E1; color: #000000; border: 1px solid #0B198C; } .tcat { background: #869BBF url(http://porandor.com/forums/images/gradients/gradient_tcat.gif) repeat-x top left; color: #FFFFFF; font: bold 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; } .tcat a:link, .tcat_alink { color: #ffffff; text-decoration: none; } .tcat a:visited, .tcat_avisited { color: #ffffff; text-decoration: none; } .tcat a:hover, .tcat a:active, .tcat_ahover { color: #FFFF66; text-decoration: underline; } .thead { background: #5C7099 url(http://porandor.com/forums/images/gradients/gradient_thead.gif) repeat-x top left; color: #FFFFFF; font: bold 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; } .thead a:link, .thead_alink { color: #FFFFFF; } .thead a:visited, .thead_avisited { color: #FFFFFF; } .thead a:hover, .thead a:active, .thead_ahover { color: #FFFF00; } .tfoot { background: #3E5C92; color: #E0E0F6; } .tfoot a:link, .tfoot_alink { color: #E0E0F6; } .tfoot a:visited, .tfoot_avisited { color: #E0E0F6; } .tfoot a:hover, .tfoot a:active, .tfoot_ahover { color: #FFFF66; } .alt1, .alt1Active { background: #F5F5FF; color: #000000; } .alt2, .alt2Active { background: #E1E4F2; color: #000000; } .inlinemod { background: #FFFFCC; color: #000000; } .wysiwyg { background: #F5F5FF; color: #000000; font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; margin: 5px 10px 10px 10px; padding: 0px; } .wysiwyg a:link, .wysiwyg_alink { color: #22229C; } .wysiwyg a:visited, .wysiwyg_avisited { color: #22229C; } .wysiwyg a:hover, .wysiwyg a:active, .wysiwyg_ahover { color: #FF4400; } textarea, .bginput { font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; } .bginput option, .bginput optgroup { font-size: 10pt; font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; } .button { font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; } select { font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; } option, optgroup { font-size: 11px; font-family: verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; } .smallfont { font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; } .time { color: #666686; } .navbar { font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; } .highlight { color: #FF0000; font-weight: bold; } .fjsel { background: #3E5C92; color: #E0E0F6; } .fjdpth0 { background: #F7F7F7; color: #000000; } .panel { background: #E4E7F5 url(http://porandor.com/forums/images/gradients/gradient_panel.gif) repeat-x top left; color: #000000; padding: 10px; border: 2px outset; } .panelsurround { background: #D1D4E0 url(http://porandor.com/forums/images/gradients/gradient_panelsurround.gif) repeat-x top left; color: #000000; } legend { color: #22229C; font: 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; } .vbmenu_control { background: #738FBF; color: #FFFFFF; font: bold 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; padding: 3px 6px 3px 6px; white-space: nowrap; } .vbmenu_control a:link, .vbmenu_control_alink { color: #FFFFFF; text-decoration: none; } .vbmenu_control a:visited, .vbmenu_control_avisited { color: #FFFFFF; text-decoration: none; } .vbmenu_control a:hover, .vbmenu_control a:active, .vbmenu_control_ahover { color: #FFFFFF; text-decoration: underline; } .vbmenu_popup { background: #FFFFFF; color: #000000; border: 1px solid #0B198C; } .vbmenu_option { background: #BBC7CE; color: #000000; font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; white-space: nowrap; cursor: pointer; } .vbmenu_option a:link, .vbmenu_option_alink { color: #22229C; text-decoration: none; } .vbmenu_option a:visited, .vbmenu_option_avisited { color: #22229C; text-decoration: none; } .vbmenu_option a:hover, .vbmenu_option a:active, .vbmenu_option_ahover { color: #FFFFFF; text-decoration: none; } .vbmenu_hilite { background: #8A949E; color: #FFFFFF; font: 11px verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; white-space: nowrap; cursor: pointer; } .vbmenu_hilite a:link, .vbmenu_hilite_alink { color: #FFFFFF; text-decoration: none; } .vbmenu_hilite a:visited, .vbmenu_hilite_avisited { color: #FFFFFF; text-decoration: none; } .vbmenu_hilite a:hover, .vbmenu_hilite a:active, .vbmenu_hilite_ahover { color: #FFFFFF; text-decoration: none; } /* ***** styling for 'big' usernames on postbit etc. ***** */ .bigusername { font-size: 14pt; } /* ***** small padding on 'thead' elements ***** */ td.thead, th.thead, div.thead { padding: 4px; } /* ***** basic styles for multi-page nav elements */ .pagenav a { text-decoration: none; } .pagenav td { padding: 2px 4px 2px 4px; } /* ***** de-emphasized text */ .shade, a.shade:link, a.shade:visited { color: #777777; text-decoration: none; } a.shade:active, a.shade:hover { color: #FF4400; text-decoration: underline; } .tcat .shade, .thead .shade, .tfoot .shade { color: #DDDDDD; } /* ***** define margin and font-size for elements inside panels ***** */ .fieldset { margin-bottom: 6px; } .fieldset, .fieldset td, .fieldset p, .fieldset li { font-size: 11px; }

dunno why but if i have more that one pic on first post i get that only happen in IE7

[GrendelKhan{TSU]

cool! bookmarked.

need to look at this (no time right now).

great concept though

[shadowdancer36]

Doesn't work with Chrome I see. In firefox it's very slow when placing the ad to the pic.

[shadowdancer36]

Would be nice if you could make this only apply to certain sections of your forum.