[Помогите] Картинка в виджете.

Тема в разделе "Wordpress", создана пользователем r0nin, 29 авг 2010.

Статус темы:
Закрыта.
Модераторы: DzSoft, Sorcus
  1. r0nin

    r0nin Постоялец

    Регистр.:
    12 апр 2010
    Сообщения:
    80
    Симпатии:
    4
    Здрасте всем.
    Возник такой вопрос.
    Как вставить маленькую иконку в верхние левые части виджета.

    Style.css

    Код:
    */
    
    body {
    font-family : Verdana, Arial,Tahoma;
    font-size : 11px;
    color : #CCCCCC;
    background :#000000;
    margin:0; padding:0;
    }
    
    a {
    color : #C4C4C4;
    text-decoration : none;
    }
    a:hover {
    text-decoration : underline;
    }
    img {margin:0; padding:0;}
    a img {border:0;}
    p {
    padding : 1px 0;
    margin : 0;
    }
    
    /*  ====================== Page Structure ======================= */
    
    #header-wrapper {
    width : 100%;  height:55px;
    background : url(images/h-bg.gif) repeat-x ;
    }
    
    #header {
    width : 100%; height:55px;margin:0 auto;
    background : url(images/header.gif) repeat-x 70px 0;
    }
    #wrapper-outer{
      width : 100%; margin:0 auto; 
      background : #000 url(images/content-top.gif) repeat-x;
    }
    
    #wrapper {
      width : 100%; margin:0 auto; padding:0;
    }
    
    
    #content{width : 34%; float:right; margin:0 auto;padding:2px 5px 0 5px; display: inline;}
    
    #lsidebar{width:16%; padding:2px 0 0  0;float:left;min-height:518px;}
    #rsidebar{width:16%; padding:2px 0 0 5px;float:right;min-height:518px;}
    #rsidebar2{width:16%; padding:2px 0 0 5px;float:right;min-height:518px;}
    #lsidebar2{width:16%; padding:2px 0 0 5px;float:left;min-height:518px;}
    * html #lsidebar {height:auto;}
    * html #rsidebar {height:auto;}
    * html #lsidebar2 {height:auto;}
    * html #rsidebar2 {height:auto;}
    
    #footer-wrapper {
    width : 100%; margin:0 auto  2px auto;background : #0D0D0D ;
    }
    
    #footer {margin:0 auto; padding:20px 0; width : 940px;text-align:center;}
    
    /*  ====================== Header ======================= */
    .sform-top {width:300px; margin:0 auto; padding:0 0 0 0;height:22px;}
    .sform-page {padding:30px 120px;height:22px;}
    .sform form {margin:0; padding:0;}
    .sform form .form-left{background:url(images/search-left.gif) no-repeat;height:22px; width:2px;float:left;}
    .sform form .form-rt{background:url(images/search-rt.gif) no-repeat;height:22px; width:2px;float:left;}
    .sform form input {margin:0; padding:0;float:left;border:0 none;}
    .sform form input.txt{background:url(images/search-bg.gif) repeat-x; padding:0 0 0 0; width:170px; height:22px; color:#fff;}
    .sform form input.btn{padding:0 3px; height:22px; color:#fff;}
    
    
    #logo {width:350px; margin:0px 2px;padding:10px 2px 12px 2px;height:auto;}
    #logo h1 {margin:0px 2px;padding:0;font-size:24px; line-height:10px;color:#fff;font-weight:normal;}
    #logo h1 a, #logo h1 a:hover {text-decoration:none;color:#fff;}
    .desc {padding-top:0px;margin:12px 0 0 0; position:absolute; color:#fff; font-family : Arial,'Trebuchet MS', Verdana;font-size : 12px;}
    #nav1{padding:0 0 0 0;}
    
    
    /* --------- Navigation -------- */
    #nav1 ul{margin:0; padding:0;}
    #nav1 li{margin:0; padding:0;}
    * html #nav li a{width:1px;}
    
    
    /*  ================================= Conatent ============================= */
    
    /* -------------------------- Posts ----------------------------- */
    
    .post { padding-bottom:15px;}
    .post-title{background:url(images/post-title1.gif) no-repeat;}
    .post h2{margin:0; padding:9px 0 2px 0;color:#fff;font-size:14px;line-height:14px;}
    .post h2.page{padding:12px 0 2px 0;}
    .post h2 a, .post h2 a:hover{color:#fff;text-decoration:none;}
    .datebox{padding:0 10px 0 0; float:left;width:51px;height:42px;text-align:center;color:#fff;}
    
    .month {font-weight:bold;font-size:10px;line-height:14px;text-transform:uppercase;}
    .date{font-size:24px;line-height:24px;color:#E12E2E;font-weight:bold;line-height:28px;}
    .title {float:left;padding:0;}
    .title p {padding:0;color:#E12E2E;}
    .title a {color:#E12E2E;}
    .entry {padding:0 10px;background:#1A1A1A url(images/post-bg.gif) repeat-y;line-height:15px;text-align:justify;}
    .comnt {background:url(images/post-btm.gif) no-repeat;height:19px;text-align:right; padding:0 10px;line-height:19px;}
    
    
    /* --------------- SideBars ----------------*/
    .SHeader
    {
    	position:relative;
    	z-index:0;
    	height: 30px;
    	padding: 0 6px;
    	margin-bottom: 15px;
    }
    
    .sidebar top
    {
        height: 25px;
    	background-position:left top;
    	background-image: url('images/test5.gif');
    	padding:0 0 0 30px;
    	background-repeat: no-repeat;
    	min-height: 18px;
    	margin: 0 0 0 5px;
    }
    
    
    .sidebar {font-weight:bold;}
    .sidebar ul {list-style : none;margin:0;padding:0;}
    .sidebar ul li {list-style : none;margin : 0;padding : 0;
    background: url(images/sidebar_bg.gif) repeat;color : #A0A0A0;
    }
    
    
    .sidebar ul li h2 {
    margin:0; padding:1px 0 0 10px;
    height:23px;
    font-size : 14px;
    background : url(images/sidebar_top.gif) no-repeat;
    color : #E12E2E;
    }
    
    .sidebar ul ul {
    list-style : none;margin :0 0 10px 0;padding : 0 0 5px 0;
    background : url(images/sidebar_btm.gif) no-repeat bottom left;
    }
    .sidebar ul ul ul{margin:0; padding:0;background : url(images/sidebar_btm1.gif) no-repeat bottom left;}
    
    .sidebar ul ul li {
    list-style : none;
    margin : 0;
    padding : 0 5px 0 10px; color : #A0A0A0;
    font-size : 11px;line-height : 26px;
    }
    
    .sidebar ul ul li a {
    color : #A0A0A0;
    text-decoration : none;
    }
    .sidebar ul ul li a:hover {
    color : #A0A0A0;
    text-decoration :underline;
    }
    
    
    
    /*  ================================= Footer ============================= */
    #footer {color:#F03030;font-size:10px;font-weight:bold;}
    #footer a{ color:#fff; text-decoration:none;}
    #footer a:hover{text-decoration:underline;}
    
    
    
    
    /* Others */
    
    .clr {clear : both; font-size:1px; line-height:1px;}
    
    /* Search Form */
    form {margin:0; padding:0;}
    .newsearchform {margin: 0 auto; width:250px; height:80px;
    background:url(images/search-box.gif) no-repeat;
    padding :25px 0 0 42px;
    }
    .newsearchform p{margin:0; padding :0; line-height:28px;}
    .newsearchform input {float:left;}
    .newsearchform input.txt {
    margin :20px 0 0 0; padding :0;
    color : #516C94;background:transparent;
    border : 0; width:120px;
    font-size : 12px;
    height:27px;
    }
    .newsearchform input.btn {
    width : 77px;border : 0;
    padding :0; margin :12px 0 0 10px;
    height : 27px;
    }
    
    
    
    /* --------------------- common elements --------------------------- */
    .navigation { display: block; width:99%;padding-bottom:20px;}
    h2.pagetitle, h2.center {margin:0;text-align: center; padding:10px 0 0 0; font-size:14px; color:#E12E2E;}
    h3 {padding: 0;margin: 5px; color : #E12E2E; font-size:14px;}
    a.more-link {font-weight:bold;display:block;}
    
    
    p.postmetadata {margin:0; padding:10px;}
    .alt { background:#1A1A1A;}
    
    input, select, textarea {
      border: 0; color:#9C9D9F; background:#565656;}
    
    #commentform #submit {margin: 0; color:#fff; background:#1A1A1A; font-weight:bold;}
    blockquote cite { display: block;}
    blockquote { margin: 0 10px; padding: 0 10px;border-left: 2px solid #eee;}
    
    ol.commentlist {margin:0;padding:0;}
    .commentlist li { font-weight:normal;}
    .commentlist cite, .commentlist cite a {
    	font-weight: bold;
    	font-style: normal;
    	font-size: 12px;
    	}
    code { font: 1.1em 'Courier New', Courier, Fixed; display:block;padding:10px; margin:10px;border: 1px dotted #eee;}
    
    /* Begin Calendar */
    #wp-calendar {empty-cells: show;margin: 10px auto 0;width: 90%;	}
    #wp-calendar #next a {padding-right: 10px;text-align: right;}
    #wp-calendar #prev a {padding-left: 10px;text-align: left;	}
    #wp-calendar a {display: block;}
    #wp-calendar caption {text-align: center;width: 100%;}
    #wp-calendar td {padding: 3px 0; text-align: center;}
    #wp-calendar td.pad:hover { background-color: #424242; }
    #wp-calendar #prev a, #wp-calendar #next a {font-size: 9pt;	}
    #wp-calendar a {text-decoration: none;	}
    #wp-calendar caption { 	text-align: center; }
    #wp-calendar th { font-style: normal;text-transform: capitalize;}
    #wp-calendar #today {font-weight:bold;color:#4E8A39;}
    /* End Calendar */
    .smallattachment {text-align: center; float: left;margin: 5px 5px 5px 0px;}
    .attachment {text-align: center; margin: 5px 0px;}
    
    /* Begin Images */
    p img {	padding: 0;	max-width: 90%;	}
    img.centered { display: block;	margin-left: auto;	margin-right: auto;	}
    img.alignright {padding: 4px; margin: 0 0 2px 7px; display: inline;	}
    img.alignleft { padding: 4px; margin: 0 7px 2px 0; display: inline; }
    /* End Images */
    
    /* Begin Lists */
    .entry ol,.entry ul {margin: 0;	padding: 5px 0 5px 35px; }
    .entry li {margin: 0; padding: 0; }
    .postmetadata ul, .postmetadata li { display: inline; list-style: none;}
    
    /* Begin Form Elements */
    .entry form { text-align:center; }
    select { width: 130px; }
    #commentform input { width: 170px; padding: 2px; margin: 5px 5px 1px 0; }
    #commentform textarea { width: 80%; padding: 2px;}
    /* End Form Elements */
    
    /* Begin Comments*/
    .alt { 	margin: 0; padding: 10px; }
    .commentlist { padding: 0; text-align: justify;}
    .commentlist li { margin: 15px 0 3px; padding: 5px 10px 3px; list-style: none;}
    .commentlist p {margin: 10px 5px 10px 0; }
    #commentform p { margin: 5px 0;	}
    .nocomments { text-align: center; }
    .commentmetadata {display: block; font-size:10px;font-weight:normal;}
    /* End Comments */
    
    /* Begin Various Tags & Classes */
    acronym, abbr, span.caps { 	cursor: help;}
    acronym, abbr { border-bottom: 1px dashed #424242; }
    .center { text-align: center;}
    hr { display: none; }
    .alignright { float: right;	}
    .alignleft { float: left;}
    .navigation .alignright { width:48%; text-align:left; 	}
    .navigation .alignleft {width:48%; text-align:left;}
    /* End Various Tags & Classes*/
    
     
  2. v-iskender

    v-iskender Постоялец

    Регистр.:
    29 июн 2009
    Сообщения:
    60
    Симпатии:
    0
    ты не файл стилей показывай, а код виджета. А по коду и определить как уместить иконку
     
  3. r0nin

    r0nin Постоялец

    Регистр.:
    12 апр 2010
    Сообщения:
    80
    Симпатии:
    4
    Да там нечего)))

    Код:
    <div class="sidebar">
    		<ul>
    
    		<?php 	/* Widgetized sidebar, if you have the plugin installed. */
    					if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar(1) ) : ?>
    
    		
    			<?php endif; ?>
    		</ul>
    	</div>
    
    
    
     
  4. ec_stasis

    ec_stasis Создатель

    Регистр.:
    5 июл 2010
    Сообщения:
    24
    Симпатии:
    3
    Если очень нужно, то можешь сохранить страницу (Ctrl+S) и приложить тут со всеми вспомогательными файлами.
     
  5. r0nin

    r0nin Постоялец

    Регистр.:
    12 апр 2010
    Сообщения:
    80
    Симпатии:
    4
    Вот страница со всем её содержимым.
     

    Вложения:

  6. polyetilen

    polyetilen Заблокирован

    Регистр.:
    10 авг 2006
    Сообщения:
    814
    Симпатии:
    474
    css класс названия виджета .sidebar ul li h2, там уже есть какая-то картинка, можно её поредактировать дорисовать иконку или вставить другую, например
    Код:
    .sidebar ul li h2 {
        margin:0;
        padding:1px 0 0 25px;
        height:23px;
        font-size:14px;
        background:url(http://www.google.com/images/icons/about_blogger.gif) left center no-repeat;
        color:#E12E2E;
    }
    
     
    r0nin нравится это.
  7. jumpeRjke

    jumpeRjke Писатель

    Регистр.:
    27 июл 2009
    Сообщения:
    4
    Симпатии:
    0
    Обычно у каждого виджета есть свой файл шаблона, зайди в папку themes найди похожий по названию файл PHP и вставь там необходимый код
     
  8. r0nin

    r0nin Постоялец

    Регистр.:
    12 апр 2010
    Сообщения:
    80
    Симпатии:
    4
    Да но эта картиинка тоже нужна )
    В данном случае новую иконку нужно как бы наложить и кстати именно на неё.
     
  9. v-iskender

    v-iskender Постоялец

    Регистр.:
    29 июн 2009
    Сообщения:
    60
    Симпатии:
    0
    попробу типа такого сделать
    Код:
    .sidebar ul {
    display:block;
    background:img(img.png) left top no-repeat;;
    }
    
     
Статус темы:
Закрыта.