Log in

View Full Version : Mini Mods - Change CMS Article LOoOK


alkrida
03-07-2010, 10:00 PM
Through these modifications, you can change you view and Look for vBulletin CMS article


You can Use a background image and of course with the background color, or only background color .

You can use and development these modified , and perhaps this subject took us out to a wonderful look of

our form and a good Layout
i I would like to learn and understand the way the amendment in the vBulletin CMS

For support, I'm not expert enough, but I love programming and vBulletin :)



---------------------1 ---------------------

To add a background image # or color # Back to the main title ((Top stories))

like

https://vborg.vbsupport.ru/attachment.php?attachmentid=113732&stc=1&d=1268080399

Styles & Templates > Search in Templates > Search in Style:Click Dropdown Arrow (Choose Actual Style)> Search for Text: vbcms.css > Search Titles Only: YES > Click Find

Search for

div.title {
position:{vb:stylevar right};

ADD After :::

border-color: #D6D6D6;
border-width: 1px 1px 1px 1px;
border-style: solid;
background: url(http://www.UR-SITE.com/images/urbackgroundimage.jpg);
background-color: #E9E9E9;

chaing the
http://www.UR-SITE.com/images/urbackgroundimage.jpg
with your image url in your site
Replace #E9E9E9 with your Color this is Gray Color

---------------------2 ---------------------

https://vborg.vbsupport.ru/attachment.php?attachmentid=113733&stc=1&d=1268080399

Chaing the article background

Styles & Templates > Search in Templates > Search in Style:Click Dropdown Arrow (Choose Actual Style)> Search for Text: vbcms.css > Search Titles Only: YES > Click Find

Search for

}

div.title a.edit {

ADD ABOVE :::

}

div.title2 {
position:{vb:stylevar right};
border-color: #D6D6D6;
border-width: 1px 1px 1px 1px;
border-style: solid;
margin: 0;
padding: 4px 4px 4px 4px;
background-color: #FFFFFF;

and if you want to add background image ::::
After that code add

background: url(http://www.UR-SITE.com/images/urbackgroundimage.jpg);

chaing the
http://www.UR-SITE.com/images/urbackgroundimage.jpg
with your image url in your site
Replace #FFFFFF with your Color , this is White Color

Styles & Templates > Search in Templates > Search in Style:Click Dropdown Arrow (Choose Actual Style)> Search for Text: vbcms_content_article_preview > Search Titles Only: YES > Click Find


Search for

<div class="article_preview">
<div class="title">


chaing the

title
To

title2

++++++++++++++3+++++++++++++

https://vborg.vbsupport.ru/attachment.php?attachmentid=113734&stc=1&d=1268080399

Background for the Comments and ReadMore>


Styles & Templates > Search in Templates > Search in Style:Click Dropdown Arrow (Choose Actual Style)> Search for Text: vbcms.css > Search Titles Only: YES > Click Find


Search for


.fullwidth {

ADD ABOVE :::


.fullwidthart {
width:100%;
padding: 0;
margin-bottom: 5px;
clear:both;
float: {vb:stylevar left};
position: relative;
display:block;
background-color: #EAEAEA;
}

Styles & Templates > Search in Templates > Search in Style:Click Dropdown Arrow (Choose Actual Style)> Search for Text: vbcms_content_article_preview > Search Titles Only: YES > Click Find

Search for

<div class="fullwidth">

<vb:if condition="$preview_chopped">
<span class="cms_article_readmore"><a href="{vb:raw page_url}">

{vb:rawphrase read_more_phrase} <img src="{vb:stylevar imgdir_cms}/read_more-{vb:stylevar right}.png" alt="{vb:rawphrase read_more_phrase}" /></a>
</span>

chaing the fullwidth to fullwidthart

preview (( the topic in the Home (http://www.art.gov.sa/content/)))
My forum is in Arabic, but the general shape apparent ..

That's all

Dr.osamA
03-09-2010, 12:21 AM
?????? ???? ???? ???? ?? ?????
?? ??? ??? ??? ???? ?? ???? ??? ??? ?????

thanxx man

god work

installed + 5 Stars

keep it up
________
DRUG TESTING KIT (http://drugtestingkit.org)

Barakat
03-09-2010, 12:51 AM
love it thanks a lot .,,,

Jabong82
03-09-2010, 01:01 AM
Very Nice thank you sir. Installed and Nominated.

alkrida
03-09-2010, 09:34 PM
glad that you like it :)

FASEOFMARS
03-22-2010, 09:55 AM
how did you get the picture to display beside the text as seen in 2?

Syria BoY
03-22-2010, 05:15 PM
Very nice bro Th10

ToNetU
03-22-2010, 09:26 PM
this is an article more than template mod. good work buddy.
cheers

jkcerda
03-26-2010, 03:15 AM
sweet

COL NIL SATIS
04-18-2010, 04:15 PM
tagged..looks great

kho91
04-18-2010, 04:42 PM
live demo?

Boosted Panda
04-19-2010, 05:40 AM
I would love to see a live demo or a full screen shot.

sKippah
04-23-2010, 01:07 PM
Works. thanks

Dr.osamA
07-12-2010, 01:54 AM
اعتقد انه يحتاج ترقية لانه لم يعد يعمل على النسخة 4.0.4

i think need to update to work with 4,0,4

thanxxx

lubbie
09-01-2010, 08:52 AM
would be nice if any could do an upgrade please

alkrida
09-07-2010, 12:30 AM
i will work in it give me 2 day