Помогите в вёрстке

[Benjamin]

Добрый день, ув. Хранители форума :) Помогите новичку в вёрстке. Мне требуется подредактировать страницу с товаром.

1) Убрать надпись "С налогом".

2) Заменить изображение "Купить" на изображение, которое я прикрепил к сообщению.

2) Убрать надпись "Модель".

[fabrikator]

надпись "Модель" со страницы Product убрать можно удалив в файле catalog/view/theme/ваша тема/template/product/product.tpl

<span><?php echo $text_model; ?></span> <?php echo $model; ?><br />

для картинки в том же файле найти <a id="button-cart" class="button"> вместо button назначить свой класс (например my-button) и потом его в файле стилей прописать как .my-button и дать нужные параметры, и конечно залить картинку себе в папку

[Benjamin]

спасибо, надпись "модель" я убрал, но как же быть с иконкой покупки?

Создал новый класс, какие параметры нужны кроме background?

[fabrikator]

Так вам советы давать не видя что происходит "это тыкать пальцем в небо"

Пробуйте поставить

background:url('../image/my-picture.png') no-repeat;

position:relative;

top:0px;

left:0px;

cursor:pointer;

и посмотрите что происходит, поменяйте значения у top и left если надо

[Benjamin]

Получилось вот так. Картинка появилась, но не полностью, а именно подогналась на текст "Купить". Может нужно как то убрать эту надпись "Купить", а заместо неё поставить картинку?

Подскажите как мне дальше быть?

[m899]

о, моя кнопка :) посмотрите как сделано http://sekret-rukodeliya.ru/

картинки сами найдете, класс кнопок с иконкой button_product

a.button_product, a.button , #menu_container {

background: #169DC0;

background: -moz-linear-gradient(top, #80C5E8 0%, #169DC0 100%);

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#80C5E8), color-stop(100%,#169DC0));

background: -webkit-linear-gradient(top, #80C5E8 0%,#169DC0 100%);

background: -o-linear-gradient(top, #80C5E8 0%,#169DC0 100%);

background: -ms-linear-gradient(top, #80C5E8 0%,#169DC0 100%);

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80C5E8', endColorstr='#169DC0',GradientType=0 );

background: linear-gradient(top, #80C5E8 0%,#169DC0 100%);

}

a.button:hover, a.button_product:hover {

background: #9FCB55;

background: -moz-linear-gradient(top, #C9E181 0%, #9FCB55 100%);

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#C9E181), color-stop(100%,#9FCB55));

background: -webkit-linear-gradient(top, #C9E181 0%,#9FCB55 100%);

background: -o-linear-gradient(top, #C9E181 0%,#9FCB55 100%);

background: -ms-linear-gradient(top, #C9E181 0%,#9FCB55 100%);

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#C9E181', endColorstr='#9FCB55',GradientType=0 );

background: linear-gradient(top, #C9E181 0%,#9FCB55 100%);

border: 1px solid #9FCB55;

}

a.button_product span {

display: inline-block;

font-size: 11px;

font-weight: bold;

line-height: 12px;

padding: 5px 10px 5px 30px;

background: url(../image/cart-button.png) no-repeat;

background-position: 6px 1px;

}

a.button_product:hover span {

color:#FFF;

background: url(../image/cart-button.png) no-repeat;

background-position: 6px 1px;

}

.product-info .cart a.button_product span {

font-size: 12px;

font-weight: bold;

line-height: 12px;

padding: 10px 17px 10px 40px;

background: url(../image/cart-button-big.png) no-repeat;

background-position: 10px 3px;

}

.product-info .cart a.button_product:hover span {

color: white;

background: url(../image/cart-button-big.png) no-repeat;

background-position: 10px 3px;

}

[Benjamin]

Огромное вам спасибо! Но у меня получился вот такой бред. :(

наложение двух картинок.

[m899]

Огромное вам спасибо! Но у меня получился вот такой бред. :(

наложение двух картинок.

там картинки только cart-button.png и cart-button-big.png маленькие иконки корзины, а сама кнопка заливается цветом background

сайт свой напишите

[Benjamin]

сайт http://веб-шоппинг.рф

дело в том, что я перехожу на opencart. и все действия произвожу на локальном сервере

[Benjamin]

вот мои два файла

[Benjamin]

каким то образом нужно удалить предыдущую кнопку "удалить"

[m899]

вот мои два файла

белые иконки по этому адресу http://sekret-rukodeliya.ru/catalog/view/theme/default/image/cart-button.png и http://sekret-rukodeliya.ru/catalog/view/theme/default/image/cart-button-big.png

[Benjamin]

Благодарю! Остается дело за малым:

1)Изменить надпись "Купить" на "В корзину".

2)Увеличить размеры данной кнопки.

[nashalneke]

Попробуйте добавить в стилях высоту, ширину и отображение блоком для кнопки.

width: ;
height: ;
display: block;

[fjeka]

Как увеличить изображения товаров? Если просто в админке увеличивать изображения, то картинки начинают накладываться друг на друга. Как увеличить корректно?

[ELITE]

поправляйте в stylesheet.css

.box-product > div {
width: 215px;
display: inline-block;
vertical-align: top;
margin-right: 20px;
margin-bottom: 20px

[fjeka]

поправляйте в stylesheet.css

.box-product > div {

width: 215px;

display: inline-block;

vertical-align: top;

margin-right: 20px;

margin-bottom: 20px

Неа не помогло. Накладываются друг на друга картинки. В каком то другом месте надо исправить. Так и не могу найти в каком.

[Deus]

m899, подскажите , пожалуйста, как вы сделали "бесконечную" длину меню и вставили артикул в продукте?

[Benjamin]

m899, подскажите , пожалуйста, как вы сделали "бесконечную" длину меню и вставили артикул в продукте?

Насколько я понял, артикул - это SKU, только переименованный.