how to make a br with images link to posts after header

[mazzo]

hio guyz
how to do like this

mazzo Reviewed by mazzo on 30th Jul 2012. how to make a br with images link to posts after header hio guyz how to do like this http://i3.lulzimg.com/2ac198edae.png Rating: 5

[Exel]

Can you rephrase your question, I dun quite understand what you're after?

[msk19994]

he wants to know how to add images in header

[mazzo]

Can you rephrase your question, I dun quite understand what you're after?

he wants to know how to add images in header

i mean how to make a box like above with images to posts
which i choose

i mean look like SLIDER SHOWS
but posts wich i manually choose not automatically from a category !

---------- Post added at 01:39 PM ---------- Previous post was at 01:38 PM ----------

if you wants more images then continuously copy paste this code between above <li><a href="POST LINK"><img src="IMAGE LINK" alt="TITLE"></a></li>

Note: initially figure out where you ve to show this image bar then edit your template and make ensure to backup your whole theme first
Image size its up to you, along with borders

works great,but there is a point before the image ! ( i put the code in the index.php)
and how to make it into a frame with title like this
title i want :LATEST RELEASES

[dljawed]

<ul><li><a href="POST LINK"><img src="IMAGE LINK" alt="TITLE"></a></li><li><a href="POST LINK"><img src="IMAGE LINK" alt="TITL"></a></li></ul>

if you wants more images then continuously copy paste this code between above <li><a href="POST LINK"><img src="IMAGE LINK" alt="TITLE"></a></li>

Note: initially figure out where you ve to show this image bar then edit your template and make ensure to backup your whole theme first
Image size its up to you, along with borders

[RT]

edit your screen.css file:

line 147, change

ul {
list-style-type: disc;
}

to:

ul {
list-style-type: none;
}

Then add this code there as well:

.entry img {
background: -moz-linear-gradient(top, #303941 0%, #252c32 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#303941), color-stop(100%,#252c32)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #303941 0%,#252c32 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #303941 0%,#252c32 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #303941 0%,#252c32 100%); /* IE10+ */
background: linear-gradient(to bottom, #303941 0%,#252c32 100%); /* W3C */
border: 1px solid #000;
padding: 5px;
}

-Find .postdate img, .postmeta img in style.css and add background: none; to it
-Make sure you add those new images between the <div class="entry">IMAGESHERE</div>

Result: http://i.imgur.com/oD3fy.png

Don't forget to clear your cache, CTRL+F5.

[mazzo]

if you wants more images then continuously copy paste this code between above <li><a href="POST LINK"><img src="IMAGE LINK" alt="TITLE"></a></li>

Note: initially figure out where you ve to show this image bar then edit your template and make ensure to backup your whole theme first
Image size its up to you, along with borders

edit your screen.css file:

line 147, change

ul {
list-style-type: disc;
}

to:

ul {
list-style-type: none;
}

Then add this code there as well:

.entry img {
background: -moz-linear-gradient(top, #303941 0%, #252c32 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#303941), color-stop(100%,#252c32)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #303941 0%,#252c32 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #303941 0%,#252c32 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #303941 0%,#252c32 100%); /* IE10+ */
background: linear-gradient(to bottom, #303941 0%,#252c32 100%); /* W3C */
border: 1px solid #000;
padding: 5px;
}

-Find .postdate img, .postmeta img in style.css and add background: none; to it
-Make sure you add those new images between the <div class="entry">IMAGESHERE</div>

Result: http://i.imgur.com/oD3fy.png

Don't forget to clear your cache, CTRL+F5.

thnx alot RT
but
make it into a frame with title like this
title i want :LATEST RELEASES

[RT]

you want it with round corners?

[mazzo]

you want it with round corners?

i mean the box of title Latest realese with images to posts, which i want to make after header
has a frame like the frame of my categories, support us, poll, login....etc

[RT]

aaah, just add this above your images code then:

<h2 class="widgettitle">Latest realese</h2>

add this to your style.css

.widgettitle {
background: url("http://www.besthostingforums.com/images/h2bg.png") repeat-x scroll 0 0 transparent;
color: #FFFFFF;
font-family: Arial,Helvetica,Sans-serif;
font-size: 14px;
font-weight: bold;
line-height: 18px;
margin: -8px -8px 0;
padding: 8px;
text-shadow: 0 1px 0 #000000;
text-transform: uppercase;
}

play around with the style to make it fit.