Сообщений в теме: 49

[Владимир1984]

Как поменять каталог (заменить кнопки каталога исходниками в формате .png) если это возможно.

Прикрепленные изображения

• 

[ne_yana]

Владимир1984 (21 Октябрь 2013 - 13:05) писал:

Как поменять каталог (заменить кнопки каталога исходниками в формате .png) если это возможно.

Добрый день, необходимо загрузить фон кнопки, после чего заменить

#left .block .navigation ul li, #right .block .navigation ul li {
background: url(http://design.accessory-online.ru/block-main-nav-bg.jpg) no-repeat;
width: 223px;
border-top: 1px solid #FFF;
border-bottom: 1px solid #e2e2e2;
overflow: hidden;
}

на

#left .block .navigation ul li, #right .block .navigation ul li {
background: url(путь к загруженному фону) no-repeat;
width: 171px;
overflow: hidden;
border: red 1px solid;
border-radius: 6px;
}

[Владимир1984]

А как сделать, чтобы верхние кнопки были точно такие же, как боковые. Чтобы текст категории был по центру, и не было бы белых полей (пробелов) между ними. Также нужно, чтобы совпадали границы. Ещё раз спасибо, извините за беспокойство)

Прикрепленные изображения

• 

[Koderhan]

Владимир1984 (21 Октябрь 2013 - 14:48) писал:

А как сделать, чтобы верхние кнопки были точно такие же, как боковые. Чтобы текст категории был по центру, и не было бы белых полей (пробелов) между ними. Также нужно, чтобы совпадали границы. Ещё раз спасибо, извините за беспокойство)

Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Найти код:

		#left .block .navigation ul li, #right .block .navigation ul li {
background: url(http://st.accessory-online.ru/2/820/365/button-7561.png) no-repeat;
width: 171px;
overflow: hidden;
border: red 1px solid;
border-radius: 6px;
}

Заменить:

		#left .block .navigation ul li, #right .block .navigation ul li {
background: url(http://st.accessory-online.ru/2/820/365/button-7561.png) no-repeat;
overflow: hidden;
border: red 1px solid;
border-radius: 6px;
}

И вам нужно будет изменить длину изображения кнопки до 223px

И для добавления картинки в верхнее меню.

Панель администратора, "Сайт"->"Редактор тем".
В файле "main.css".
Добавить в конец файла код:

#panelsite div.centercol .menuheader ul li {
float:left;
background: url(http://st.accessory-online.ru/2/820/365/button-7561.png) -10px 0px no-repeat;
margin: 0 10px 0 0px;
padding-left: 0px;
border-radius: 10px;
}

[Владимир1984]

Огромное Спасибо. Получается.

[Виолетта]

ne_yana (21 Октябрь 2013 - 09:30) писал:

Здравствуйте, выпуклость у кнопок была из-за того, что фоном кнопки была картинка, а теперь просто установленный Вами цвета.Сменить синюю кнопку можно, изменив следующий блок:

.whtblue:hover {background: url(http://design.good4hobby.ru/whtblue-bg.jpg) center top repeat;border: 1px solid #5fa8c4;color: #3e3e3e;text-shadow: 0px 1px 0 rgba(255, 255, 255, 0.4);}

а зеленые:

.whtgreen:hover, .blgreen:hover {
background: url(http://design.good4hobby.ru/whtgreen-bg.jpg) center center repeat;
border: 1px solid #83a61d;
color: #1c1c1c;
text-shadow: 0px 1px 0 rgba(255, 255, 255, 0.4);
}

Спасибо за ответ. Не могли бы вы уточнить что именно нужно изменить,чтобы получить желаемое. А то,я видимо что-то не то меняю,так как исчезает сама кнопка Подробнее,при наведении появляется синий блок вместо этого, и надпись В корзину окрашивается в ярко-голубой,хотя у меня выбран другой цвет. Цвет мне нужен вот этот #6A6EAA

И еще,подскажите пожалуйста как будет выглядеть блок для изменения вот этой конкретной кнопки Оформить заказ(хочу вернуть первоначальный цвет).

Прикрепленные изображения

• 

[Vaccina]

Задание цвета не даст вам нужный результат. Необходимо использовать изображение кнопки для придания кнопки различных визуальных стилей. Вам желательно бы вернуть стили кнопок обратно, после чего уже изменить сами изображения кнопок в графическом редакторе. По умолчанию стили кнопок выглядят так

/*Контентная часть сайта*/
  /*Кнопки*/
  .whtblue { border:1px solid #d0d0d0 !important; background:url({ASSETS_IMAGES_PATH}whtblue-nor.jpg) center top repeat-x; padding:5px 15px; font:normal 12px Verdana, Geneva, sans-serif; color:#504f4f; height:27px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius:4px; cursor:pointer; outline:none; }
  @-moz-document url-prefix() { .whtblue { padding:2px 12px 5px 12px; height:27px; }  a.whtblue { padding:5px 12px 5px 12px; height:27px;} }
  .whtblue:hover { background:url({ASSETS_IMAGES_PATH}whtblue-bg.jpg) center top repeat; border:1px solid #5fa8c4; color:#3e3e3e; text-shadow: 0px 1px 0 rgba(255, 255, 255, 0.4);  }
  .whtblue:active { background:url({ASSETS_IMAGES_PATH}whtblue-bg.jpg) center bottom repeat; border:1px solid #5fa8c4; }
  .whtgreen { border:1px solid #d0d0d0; background:url({ASSETS_IMAGES_PATH}whtgreen-bg.jpg) center top repeat-x; padding:4px 10px 2px 10px; font:normal 11px Verdana, Geneva, sans-serif; color:#3a3a3a;  -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius:4px; cursor:pointer; text-shadow: 0px 1px 0 rgba(255, 255, 255, 1);}
  @-moz-document url-prefix() { button.whtgreen { height:23px; padding:2px 10px 4px 10px; position:relative; top:1px; } }
  .whtgreen:hover, .blgreen:hover   { background:url({ASSETS_IMAGES_PATH}whtgreen-bg.jpg) center center repeat; border:1px solid #83a61d; color:#1c1c1c; text-shadow: 0px 1px 0 rgba(255, 255, 255, 0.4);  }
  .whtgreen:active, .blgreen:active { background:url({ASSETS_IMAGES_PATH}whtgreen-bg.jpg) center bottom repeat; }
  .blgreen {  background:url({ASSETS_IMAGES_PATH}whtblue-bg.jpg) center top repeat; border:1px solid #5fa8c4; color:#494949; text-shadow: 0px 1px 0 rgba(255, 255, 255, 0.4); padding:4px 10px 2px 10px; //padding:1px 10px 0px 10px; //line-height:10px; font:normal 11px Verdana, Geneva, sans-serif;  -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius:4px; cursor:pointer;}
  a.blgreen, a.whtgreen, a.whtblue, a.whtgray { text-decoration:none; display:inline-block; height:15px; }
  @-moz-document url-prefix() { button.blgreen { height:23px; padding:2px 10px 4px 10px;  } }
  a.whtgray, button.whtgray  { background:url({ASSETS_IMAGES_PATH}whtgray-bg.jpg) top center no-repeat; width:138px; height:18px; padding:7px 0 6px 0; text-align:center; font:bold 12px Verdana, Geneva, sans-serif; color:#3a3a3a; cursor:pointer; text-shadow: 0px 1px 0 rgba(255, 255, 255, 1); margin:0 10px 0 0;}
  a.whtgray:hover, button.whtgray:hover { background:url({ASSETS_IMAGES_PATH}whtgray-bg.jpg) center center no-repeat; }
  a.whtgray:active, button.whtgray:active { background:url({ASSETS_IMAGES_PATH}whtgray-bg.jpg) center bottom no-repeat; }
  button.whtgray { float:left; height:31px; padding:4px 0 6px 0;  }
  #mainindex button.blgreen { width:86px; float:left; margin:0 0 0 5px; padding-bottom:4px; }
  #mainindex a.whtgreen { float:left; margin:0 0 0 30px; }
  button:hover { cursor:pointer; }
  input[type=submit].whtgreen, button.whtgreen { padding:4px 10px; }
/*Блоки левой и правой части*/

данные стили заданы в файле стилей main.css. Найти необходимый блок можно по комментариям /*Контентная часть сайта*/ и /*Блоки левой и правой части*/

[Виолетта]

Спасибо за ответ. Да,пожалуй так и поступлю, а то они мне совсем не нравятся невыпуклые. Все вернула,но кнопка Оформить заказ так и осталась такой как на скриншоте. Сейчас уже и не знаю как вернуть ее обратно,столько всего наменяла. Подскажите как ее вернуть тоже в первоначальный вид?

[Сake]

Просто найдите и удалите в файле стилей main.css правило

.whtblue, input.paymentFormTbodySubmitButton[type="submit"] {
  background: #B2A7F4;
  border: 1px solid #6A6EAA !important;
  border-radius: 4px 4px 4px 4px;
  color: #2B2D3F;
  cursor: pointer;
  font: 12px Verdana,Geneva,sans-serif;
  height: 27px;
  outline: medium none;
  padding: 5px 15px;
}

[Виолетта]

Спасибо большое. Все супер!