Do not remember me!
Sort articles by: Date | Most Rates | Most Views | Comments | Alphabet

How to customize my uploaded pictures in fullstory

+2
I would like to know how can i customize my uploaded pictures in fullstory.tpl like this:
How to customize my uploaded pictures in fullstory


i want to customize normally and using xfields for pics. Added by: in CSS Questions on
You can easily do it using css like this
[xfgiven_picture]
<div class="pictures">
[xfvalue_picture]
</div>
[/xfgiven_picture]

CSS
.pictures{display:block;padding:10px;margin:10px auto;background:#333;text-align:center}
.pictures img{display:inline-block;padding:2px;border:1px solid #777;text-align:center;max-height:200px}
Answered by: dlefaq

Rating

+9
Can you help with making those to my website Rating Added by: in CSS Questions on
Yes, this can be done easily without using any images at all, but you will need css and font awesome (if you already using font awesome with your theme then it's super easy...I have attached font awesome with this message if don't have it in your theme...

1) open one of your css file from your template folder and add this at the end

This is font awesome style calling (no need for this css if you already using font awesome with your theme)
@font-face{
font-family:'FontAwesome';
src:url('fonts/fontawesome-webfont.eot?v=4.2.0');
src:url('fonts/fontawesome-webfont.eot?#iefix&v=4.2.0') format('embedded-opentype'),
url('fonts/fontawesome-webfont.woff?v=4.2.0') format('woff'),
url('fonts/fontawesome-webfont.ttf?v=4.2.0') format('truetype'),
url('fonts/fontawesome-webfont.svg?v=4.2.0#fontawesomeregular') format('svg');
font-weight:normal;
font-style:normal
}
.fa{
display:inline-block;
font:normal normal normal 14px/1 FontAwesome;
font-size:inherit;
text-rendering:auto;
-webkit-font-smoothing:antialiased;
-moz-osx-font-smoothing:grayscale
}
.fa-thumbs-up:before{content:"\f164"}
.fa-thumbs-down:before{content:"\f165"}

Add this at the end of css file
/* DLE 10.4 rating type = 3 style */
.rating-box{font-size:0;margin:0;padding:0}
.rating-box .thumbdown,.rating-box .thumbup,.rating-box .thumbnum{font-size:14px;height:20px;line-height:20px;padding:4px 10px}
.rating-box .thumbdown{background:#cb1212;color:#fff;-webkit-border-radius:3px 0 0 3px;border-radius:3px 0 0 3px}
.rating-box .thumbdown:hover{background:#aa1313;color:#fff}
.rating-box .thumbup{background:#278e0c;color:#fff;-webkit-border-radius:0 3px 3px 0;border-radius:0 3px 3px 0}
.rating-box .thumbup:hover{background:#1d7f03;color:#fff}
.rating-box .thumbnum{background:#ddd}
.ratingzero{color:#6c838e}
.ratingtypeplusminus{padding:0 2px}
.ratingtypeplus{color:#6c838e}
.ratingplus{color:green}
.ratingminus{color:red}
/* DLE 10.4 rating type = 3 style */
In your theme html in shortstory.tpl,fullstory.tpl,comments.tpl and comments.tpl use this html code for rating type "3"
[rating-type-3]
<div class="rating-box">
[rating-minus]<span class="thumbdown"><i class="fa fa-thumbs-down"></i></span>[/rating-minus]
<span class="thumbnum">+9</span>
[rating-plus]<span class="thumbup"><i class="fa fa-thumbs-up"></i></span>
[/rating-plus]
</div>
[/rating-type-3]

Note: this type of rating only available with DLE 10.4

Download font awesome below and place in your "style" folder where your css located
You are not allow to download file from our server
Answered by: yorismith

Ads by DLEStarter.com