Seyret bileşeni üzerinde ufak bir derleme yaptık. Orjinalinden farklı bir video sitesine benzer hal almış oldu. Bu düzenlemeyi yapamayan arkadaşlar için dosyaları EK'te sundum. Klasör içindeki dosyaları com_seyret içerisindeki dosyaların üzerine yazdırmaları yeterli olacaktır. Mevcut bileşende CSS düzenlemesi yaptıysanız şahet CSS dosyaları orjinal CSS dosyalarının üzerine ekleme yapılmıştır.
Son olarakda bileşenin dil dosyasındaki "_MOSTVIEWEDVIDEOS" satırının karşılığını "Top 15" şeklinde değiştirebilirler..
CSS Dosyanısına Eklenmesi Gereken
Temanıza göre düzenleme yaparsınız..
- Kod: Tümünü seç
/* ============== YOUTUBE COLUMN CONTAINERS ================= */
#videomainbody{
margin-left:auto;
margin-right:auto;
float:left;
position:relative;
width:100%;
}
#videoleft-column{
float:left;
margin-right:10px;
margin-top:1px;
width:20%;
}
#videomiddle-column{
float:left;
width:80%;
}
#videoright-column{
float:right;
margin-left:5px;
margin-top:1px;
width:18%;
}
#videopagination{
text-align:center;
margin-top:10px;
margin-bottom:15px;
}
/* ============== YOUTUBE STYLE GRID FOR VIDEO LIST ================= */
.vlcell {
display:inline;
float:left;
width:24.9%;
margin-bottom:5px;
overflow:auto;
}
.vlentry {
float:left;
width:140px;
}
.vlcontainer {
width:auto;
}
.v120WrapperOuter, .videoIconWrapperOuter {
border:1px solid #999999;
width:142px;
height:105px;
}
.videoIconWrapperInner, .v120WrapperInner {
border:1px solid #FFFFFF;
height:105px;
overflow:hidden;
width:140px;
}
.addtoQL90 {
margin-left:0px;
margin-top:-24px;
padding:1px;
text-align:left;
width:100%;
}
.browseGridView .vldescbox, .membersGridView .vldescbox {
font-size:9px;
font-weight:bold;
margin-top:5px;
}
.vlshortTitle {
height:35px;
width:100%;
overflow:hidden;
}
.vlfacets {
font-size:11px;
line-height:13px;
margin:3px 0px;
}
.grayText {
color:#666666;
}
.clearL {
clear:left;
}
.clearboth {
clear:both;
}
.video-thumb-duration-rating div {
margin-top:0px;
}
.totalvidhits {
margin-bottom:2px;
}
/* ============== YOUTUBE STYLE SUB MENU ================= */
.videoModifiers {
border-top:1px solid #CCCCCC;
border-bottom:1px solid #CCCCCC;
padding:5px 0;
text-align:center;
margin-bottom:10px;
}
.videoModifiers .selected {
font-weight:bold;
}
.videoModifiers div.subcategory {
border-left:1px solid #CCCCCC;
display:inline;
font-size:11px;
padding:0 10px;
}
.videoModifiers div.first {
border-left:0 none;
padding:0 10px 0 2px;
}
#masthead {
margin:4px auto 0;
padding-bottom:15px;
width:950px;
}
#masthead .bar {
float:left;
height:35px;
width:950px;
}
#masthead .bar .leftcap {
background:transparent url(../images/seyretmaster.png) no-repeat scroll -132px 0;
display:block;
float:left;
height:37px;
width:5px;
}
#masthead .search-bar {
background:transparent url(../images/seyretmaster.png) repeat-x scroll 0 -63px;
border:medium none;
float:left;
height:37px;
padding:0;
width:940px;
}
#masthead .bar .rightcap {
background:transparent url(../images/seyretmaster.png) no-repeat scroll -137px 0;
display:block;
float:left;
height:37px;
width:5px;
}
#masthead #search-form {
display:block;
float:left;
height:30px;
margin:0;
padding:7px 10px 0 300px;
}
#search-term {
border:1px solid #CCCCCC;
display:inline;
font-size:13px !important;
margin-right:4px;
padding:2px 0 3px;
vertical-align:top;
width:211px;
}
/******************* TOP TABS *****************/
#glowtabs-container {
margin-left: auto;
margin-right: auto;
width:50em;
}
#glowingtabs{
/* float:left; */
font-size:11px;
/* line-height:normal;
border-bottom: 1px solid #d8d8d8; Add border strip to bottom of menu*/
}
#glowingtabs ul{
list-style-type: none;
margin:0;
margin-left: 3px; /*Left offset of entire tab menu relative to page*/
padding:0;
}
#glowingtabs li{
display:inline;
margin:0;
padding:0;
}
#glowingtabs a{
float:left;
background:url(../images/glowtab-left.png) no-repeat left top;
margin:0;
margin-right: 3px; /*spacing between each tab*/
padding:0 0 0 9px;
text-decoration:none;
}
#glowingtabs a span{
float:left;
display:block;
background:url(../images/glowtab.png) no-repeat right top;
padding: 4px 12px 2px 3px;
font-weight:bold;
color:#3B3B3B;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#glowingtabs a span {float:none;}
/* End IE5-Mac hack */
#glowingtabs a:hover span {
color: black;
}
#glowingtabs #current a{ /*Selected Tab style*/
background-position:0 -37px; /*Shift background image up to start of 2nd tab image*/
}
#glowingtabs #current a span{ /*Selected Tab style*/
background-position:100% -37px; /*Shift background image up to start of 2nd tab image*/
color: black;
}
#glowingtabs a:hover{ /*onMouseover style*/
background-position:0% -74px; /*Shift background image up to start of 2nd tab image*/
}
#glowingtabs a:hover span{ /*onMouseover style*/
background-position:100% -74px; /*Shift background image up to start of 2nd tab image*/
}
<!--[if IE]>
p.iepara{ /*Conditional CSS- For IE (inc IE7), create 1em spacing between menu and paragraph that follows*/
padding-top: 1em;
}
Görünümün Demosu için : http://www.utopya.gen.tr/site/video.html
İyi günlerde kullanın
