Перейти к содержанию
pixotico

Как менять растояние между продуктами ?

Рекомендуемые сообщения

Помогите поменять растояние между прoдуктами

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

чет народ совсем обленился =)

в ..catalogviewthemedefaultstylesheetstylesheet.css:

в .list td добавь свойства:

padding-left: 10px;padding-right: 10px;
только со своими значениями

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Спасибка зделал, но не помогает ! раз сто попробовал ! дело в том что у меня между продуктами слишком много места по горизонтали,между каждым продуктом, никак не убрать .. :(вот что у меня .list td { text-align: center; vertical-align: top; padding-bottom: 5px; padding-left: 10px;padding-right: 10px;}пробовал стовить значение 0 ... 1 ..2 все ровно не получаеться

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

эмм.. откуда там много места то?) шаблон у тебя стандартный?как вариант если много места, то может не расстояние уменьшать, а больше товаров в ряд сделать?)в любом случае для лучшего понимания ситуации сделай скриншот, покажи что там у тебя.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

да, шаблон стандартный только этот карбоновый, черный, я его зделал резиновым поставил #container {

width: 90%;

margin-left: 5%;

margin-right: 5%;

text-align: left;

}

ну и продуктам поставил

.list td {

text-align: center;

vertical-align: top;

padding-bottom: 5px;

padding-left: 1px;

padding-right: 1px;

}

проблему все таки решил ...но частично .. дело было в размере самого продукта, но одно плохо, если открывать в экран по больше то он в ряд покажет стокоже продуктов сколько покажет на 19 монике .. а если открыть с нет бука где ваше моник наверное на 14 .. а вот ка кзделать что продукты в ряд автоматически сортировались по размеру и разрешению экрана не знаю ..

а продовать буду майки и им нужны больште фотки.. чтоб сразу цепляло . но и + шас редко кто на слабом разрешений сидит http://farm5.static.flickr.com/4012/4627505628_43fd9df212_b.jpg

ну вобщем спасибка заранее за помошь ! :(

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

а ну тогда понятно) я то думал тебе наоборот места мало между товарами.

тогда делай так:

в файле ..catalogviewthemedefaulttemplateproductcategory.tpl найди:

<table class="list">      <?php for ($i = 0; $i < sizeof($products); $i = $i + 4) { ?>      <tr>        <?php for ($j = $i; $j < ($i + 4); $j++) { ?>        <td width="25%"><?php if (isset($products[$j])) { ?>          <a href="<?php echo $products[$j]['href']; ?>"><img src="<?php echo $products[$j]['thumb']; ?>" title="<?php echo $products[$j]['name']; ?>" alt="<?php echo $products[$j]['name']; ?>" /></a>          <a href="<?php echo $products[$j]['href']; ?>"><?php echo $products[$j]['name']; ?></a>          [color= #999; font-size: 11px;]<?php echo $products[$j]['model']; ?>[/color]          <?php if ($display_price) { ?>          <?php if (!$products[$j]['special']) { ?>          [color= #900; font-weight: bold;]<?php echo $products[$j]['price']; ?>[/color]          <?php } else { ?>          [color= #900; font-weight: bold; text-decoration: line-through;]<?php echo $products[$j]['price']; ?>[/color] [color= #F00;]<?php echo $products[$j]['special']; ?>[/color]          <?php } ?>          <?php } ?>          <?php if ($products[$j]['rating']) { ?>          <img src="catalog/view/theme/default/image/stars_<?php echo $products[$j]['rating'] . '.png'; ?>" alt="<?php echo $products[$j]['stars']; ?>" />          <?php } ?>          <?php } ?></td>        <?php } ?>      </tr>      <?php } ?>    </table>

замени на:

<div class="list">      <?php for ($j = 0; $j < sizeof($products); $j++) { ?>        <div style="float: left;"><?php if (isset($products[$j])) { ?>          <a href="<?php echo $products[$j]['href']; ?>"><img src="<?php echo $products[$j]['thumb']; ?>" title="<?php echo $products[$j]['name']; ?>" alt="<?php echo $products[$j]['name']; ?>" /></a>          <a href="<?php echo $products[$j]['href']; ?>"><?php echo $products[$j]['name']; ?></a>          [color= #999; font-size: 11px;]<?php echo $products[$j]['model']; ?>[/color]          <?php if ($display_price) { ?>          <?php if (!$products[$j]['special']) { ?>          [color= #900; font-weight: bold;]<?php echo $products[$j]['price']; ?>[/color]          <?php } else { ?>          [color= #900; font-weight: bold; text-decoration: line-through;]<?php echo $products[$j]['price']; ?>[/color] [color= #F00;]<?php echo $products[$j]['special']; ?>[/color]          <?php } ?>          <?php } ?>          <?php if ($products[$j]['rating']) { ?>          <img src="catalog/view/theme/default/image/stars_<?php echo $products[$j]['rating'] . '.png'; ?>" alt="<?php echo $products[$j]['stars']; ?>" />          <?php } ?>          <?php } ?></div>      <?php } ?>    </div>

в stylesheet.css добавь:

.list div {	text-align: center;	vertical-align: top;	padding-bottom: 5px;	padding-left: 1px; // расстояние теперь будет маленькое, этими параметрами придется расширятьpadding-right: 1px;;}

и впринципе у тебя товары будут размещаться по ширине, хоть 100 штук если монитор такой найдешь, как место кончается они спрыгивают на другой ряд.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

СпасибкаТебе огромное :( но всеже чтото не получилось .. вроде все заменил как написал ты .. проверил нифига, если делаешь маленкое окно браузера то продукты выходят за рамки в право..

вот кстати и сам код что изменил

/catalog/view/theme/default/template/product/category.tpl

<?php echo $header; ?><?php echo $column_left; ?><?php echo $column_right; ?><div id="content">  <div class="top">    <div class="left"></div>    <div class="right"></div>    <div class="center">      <h1><?php echo $heading_title; ?></h1>    </div>  </div>  <div class="middle">    <?php if ($description) { ?>    <div style="margin-bottom: 15px;"><?php echo $description; ?></div>    <?php } ?>    <?php if ($categories) { ?>    <table class="list">      <?php for ($i = 0; $i < sizeof($categories); $i = $i + 4) { ?>      <tr>        <?php for ($j = $i; $j < ($i + 4); $j++) { ?>        <td width="25%"><?php if (isset($categories[$j])) { ?>          <a href="<?php echo $categories[$j]['href']; ?>"><img src="<?php echo $categories[$j]['thumb']; ?>" title="<?php echo $categories[$j]['name']; ?>" alt="<?php echo $categories[$j]['name']; ?>" style="margin-bottom: 3px;" /></a>          <a href="<?php echo $categories[$j]['href']; ?>"><?php echo $categories[$j]['name']; ?></a>          <?php } ?></td>        <?php } ?>      </tr>      <?php } ?>    </table>    <?php } ?>    <?php if ($products) { ?>    <div class="sort">      <div class="div1">        <select name="sort" onchange="location = this.value">          <?php foreach ($sorts as $sorts) { ?>          <?php if (($sort . '-' . $order) == $sorts['value']) { ?>          <option value="<?php echo $sorts['href']; ?>" selected="selected"><?php echo $sorts['text']; ?></option>          <?php } else { ?>          <option value="<?php echo $sorts['href']; ?>"><?php echo $sorts['text']; ?></option>          <?php } ?>          <?php } ?>        </select>      </div>      <div class="div2"><?php echo $text_sort; ?></div>    </div><div class="list">      <?php for ($j = 0; $j < sizeof($products); $j++) { ?>        <div style="float: left;"><?php if (isset($products[$j])) { ?>          <a href="<?php echo $products[$j]['href']; ?>"><img src="<?php echo $products[$j]['thumb']; ?>" title="<?php echo $products[$j]['name']; ?>" alt="<?php echo $products[$j]['name']; ?>" /></a>          <a href="<?php echo $products[$j]['href']; ?>"><?php echo $products[$j]['name']; ?></a>          [color= #999; font-size: 11px;]<?php echo $products[$j]['model']; ?>[/color]          <?php if ($display_price) { ?>          <?php if (!$products[$j]['special']) { ?>          [color= #900; font-weight: bold;]<?php echo $products[$j]['price']; ?>[/color]          <?php } else { ?>          [color= #900; font-weight: bold; text-decoration: line-through;]<?php echo $products[$j]['price']; ?>[/color] [color= #F00;]<?php echo $products[$j]['special']; ?>[/color]          <?php } ?>          <?php } ?>          <?php if ($products[$j]['rating']) { ?>          <img src="catalog/view/theme/default/image/stars_<?php echo $products[$j]['rating'] . '.png'; ?>" alt="<?php echo $products[$j]['stars']; ?>" />          <?php } ?>          <?php } ?></div>      <?php } ?>    </div>  <div class="bottom">    <div class="left"></div>    <div class="right"></div>    <div class="center"></div>  </div></div><?php echo $footer; ?>

Ну и этот

/catalog/view/theme/cc_carbon_tab/stylesheet/stylesheet.css

пробовал и catalogviewthemedefaulttemplateproductcategory.tpl поменять но так как я использую этот темплэйт то там нихрена не работает ваще :( но всеж попробовал :)

html {	overflow: -moz-scrollbars-vertical;	margin: 0;	padding: 0;}* {	font-family: Arial, Helvetica, sans-serif;}body {	margin: 0px;	padding: 0px;	text-align: center;}body, td, th, input, textarea, select, a {	font-size: 12px;}form {	padding: 0;	margin: 0;	display: inline;}input, textarea, select {	margin: 3px 0px;}a, a:visited {	color: #1B57A3;	text-decoration: underline;	cursor: pointer;}a:hover {	text-decoration: none;}a img {	border: none;}p {	margin-top: 0px;}/* layout */ #container {    width: 80%;    margin-left: 10%;   margin-right: 10%;     text-align: left;}#header .div2 {	float: left;	padding-top: 15px;	padding-left: 15px;}#header .div3 {	float: right;	padding-top: 7px;	height: 38px;}#header .div3 a {	margin-left: 15px;	padding: 1px 0px 2px 20px;	background-repeat: no-repeat;	background-position: left center;}#header .div4 {	width: 510px;	clear: right;	float: right;	height: 32px;	padding-right: 14px;}#header .div4 a {	float: left;	margin-right: 2px;	width: 100px;	height: 18px;	padding-top: 9px;	padding-bottom: 9px;	background: url('../image/tab_1.png') no-repeat;	text-align: center;	color: #333333;	text-decoration: none;	font-size: 14px;	font-weight: bold;	position: relative;	z-index: 1;}#header .div4 a.selected {	background: url('../image/tab_2.png') no-repeat;	color: #FFF;	padding-bottom: 10px;	z-index: 3;}#header .div5 {	clear: both;}#header .div5 .left {	background: url('../image/header_1_left.png') no-repeat;	width: 5px;	height: 40px;	float: left;}#header .div5 .right {	background: url('../image/header_1_right.png') no-repeat;	width: 5px;	height: 40px;	float: right;}#header .div5 .center {	background: url('../image/header_1_center.png') repeat-x;	height: 40px;	margin-left: 5px;	margin-right: 5px;}#header .div6 {	clear: both;	margin-bottom: 10px;}#header .div6 .left {	background: url('../image/header_2_left.png') no-repeat;	width: 5px;	height: 32px;	float: left;}#header .div6 .right {	background: url('../image/header_2_right.png') no-repeat;	width: 5px;	height: 32px;	float: right;}#header .div6 .center {	background: url('../image/header_2_center.png') repeat-x;	height: 32px;	margin-left: 5px;	margin-right: 5px;	padding-left: 5px;	padding-right: 5px;}#header .div7 {	float: right;	padding-top: 2px;}#header .div8 {	float: left; margin-top: 6px;}#header .div9 {	float: left;}#header .div10 {	float: left; 	margin-top: 2px;	}#search {	padding-top: 7px;	padding-left: 5px;	color: #FFF;	font-weight: bold;}#search select {	border: 1px solid #0A5391;	padding: 1px;}#search a {	color: #FFF;}#search input {	border: 1px solid #0A5391;	padding: 2px;}#breadcrumb {	float: left;	padding-top: 7px;	padding-bottom: 11px;	height: 13px;	margin-bottom: 10px;	color: #000000;}.switcher {	float: right;		margin-top: 3px;	margin-left: 10px;}.switcher a {	text-decoration: none;	display: block;}.switcher .selected {	background: #FFFFFF url('../image/switcher.png') repeat-x;}.switcher .selected a {	border: 1px solid #CCCCCC;	background: url('../image/arrow_down.png') 116px center no-repeat;	color: #666666;	padding: 2px 5px 2px 5px;	width: 121px;}.switcher .selected a:hover {	background: #F0F0F0 url('../image/arrow_down.png') 116px center no-repeat;}.switcher .option {		position: absolute;	z-index: 3;	border-left: 1px solid #CCCCCC;	border-right: 1px solid #CCCCCC;	border-bottom: 1px solid #CCCCCC;	background-color: #EEEEEE;	display: none;	width: 131px;}.switcher .option a {	color: #000;	padding: 3px 5px 3px 5px;}.switcher .option a:hover {	background: #FFC;}.switcher img {	position: relative;	top: 1px;}#column_left {	float: left;	width: 180px;	margin-right: 10px;	clear: left;}#column_right {	float: right;	width: 180px;	margin-left: 10px;	clear: right;}#content {	margin-left: 190px;	margin-right: 190px;	margin-bottom: 10px;}#content .top .left {	background: url('../image/content_top_left.png') no-repeat;	width: 5px;	height: 32px;	float: left;}#content .top .right {	background: url('../image/content_top_right.png') no-repeat;	width: 5px;	height: 32px;	float: right;}#content .top .center {	background: url('../image/content_top_center.png') repeat-x;	margin-left: 5px;	margin-right: 5px;}#content .top h1 {	padding: 8px 0px 8px 7px;}#content h1, .heading {	color: #FFFFFF;	font-size: 14px;	font-family: Arial, Helvetica, sans-serif;	font-weight: bold;	text-transform: uppercase;	margin: 0px;}.heading {	border-bottom: 1px solid #333333;	padding-bottom: 3px;	margin-bottom: 10px;}#content .middle {	border-left: 1px solid #333333;	border-right: 1px solid #333333;	background: #FFFFFF;	padding: 10px 10px 1px 10px;	min-height: 380px;}#content .bottom .left {	background: url('../image/content_bottom_left.png') no-repeat;	width: 5px;	height: 5px;	float: left;}#content .bottom .right {	background: url('../image/content_bottom_right.png') no-repeat;	width: 5px;	height: 5px;	float: right;}#content .bottom .center {	background: url('../image/content_bottom_center.png') repeat-x;	height: 5px;	margin-left: 5px;	margin-right: 5px;}.box {	margin-bottom: 10px;	background: url('../image/box_top.png') no-repeat;}.box .top {	padding: 8px 0px 8px 7px;	color: #FFFFFF;	font-size: 14px;	font-family: Arial, Helvetica, sans-serif;	font-weight: bold;	text-transform: uppercase;}.box .top img {	float: left;	margin-right: 5px;}.box .middle {	border-left: 1px solid #333333;	border-right: 1px solid #333333;	background: #FFFFFF;	padding: 10px;}.box .bottom {	height: 5px;	background: url('../image/box_bottom.png') no-repeat;}.success {	padding: 5px 0px;	margin-bottom: 10px;	background: #E4F1C9;	border: 1px solid #A5BD71;	font-size: 11px;	font-family: Verdana, Geneva, sans-serif;	text-align: center;}.warning {	padding: 5px 0px;	margin-bottom: 10px;	background: #FFDFE0;	border: 1px solid #FF9999;	font-size: 11px;	font-family: Verdana, Geneva, sans-serif;	text-align: center;}.wait {	padding: 5px 0px;	margin-bottom: 10px;	background: #FBFAEA;	border: 1px solid #EFEBAA;	font-size: 11px;	font-family: Verdana, Geneva, sans-serif;	text-align: center;}.required {	color: #FF0000;	font-weight: bold;}.error {	color: #FF0000;	display: block;}.help {	cursor: pointer;}.tooltip {	border: 1px solid #FDDA5C;	background: #FBFF95;	padding: 5px;	font-size: 11px;	width: 250px;}.clear { /* generic container (i.e. div) for floating buttons */	overflow: hidden;	width: 100%;}.button {	padding-left: 8px;	display: inline-block;	margin-right: 5px;	background: url('../image/button_left.png') top left no-repeat;	text-decoration: none;	color:#FFF;}.button span {	color: #FFF;	display: block;	padding: 4px 12px 5px 5px;	background: url('../image/button_right.png') top right no-repeat;}.buttons {	background: #F8F8F8;	border: 1px solid #DDDDDD;	padding: 5px;	margin-bottom: 10px;}.buttons input {	padding: 0px;	margin: 0px;}.buttons table {	width: 100%;	border-collapse: collapse;}.buttons table td {	vertical-align: middle;}.content {	background: #F7F7F7;	border: 1px solid #DDDDDD;	padding: 10px;	margin-top: 3px;	margin-bottom: 10px;}.list {	margin-bottom: 10px;        width: 100%;	}.list div {   text-align: center;   vertical-align: top;   padding-bottom: 5px;   padding-left: 1px; padding-right: 1px;}.list td {	        text-align: center;	vertical-align: top;	padding-bottom: 5px;	padding-left: 1px;padding-right: 1px;}.sort {	margin-bottom: 10px;	background: #F8F8F8;	height: 30px;	width: 100%;}.sort .div1 {	float: right;	margin-left: 5px;	padding-top: 6px;	padding-right: 9px;}.sort .div2 {	text-align: right;	padding-top: 9px;}.sort select {	font-size: 11px;	margin: 0;	padding: 0;}.pagination {	display: inline-block;	width: 100%;	background: #F8F8F8;	margin-bottom: 10px;}.pagination .links, .pagination .results {	padding: 7px;}.pagination .links {	float: left;}.pagination .links a {	border: 1px solid #CCCCCC;	padding: 4px 7px;	text-decoration: none;	color: #000000;}.pagination .links b {	border: 1px solid #CCCCCC;	padding: 4px 7px;	text-decoration: none;	color: #000000;	background: #FFFFFF;}.pagination .results {	float: right;}.tabs {	width: 100%;	height: 31px;	margin-bottom: 0px;}.tabs a {	float: left;	display: block;	padding: 6px 15px 7px 15px;	margin-right: 2px;	border-top: 1px solid #DDDDDD;	border-bottom: 1px solid #DDDDDD;	border-left: 1px solid #DDDDDD;	border-right: 1px solid #DDDDDD;	background: #FFFFFF url('../image/tab_3.png') repeat-x;	color: #000000;	font-weight: bold;	font-size: 13px;	text-decoration: none;	z-index: 1;	position: relative;	top: 1px;}.tabs a.selected {	background: #FFFFFF url('../image/tab_3.png') repeat-x;	border-bottom: 0px;	padding-bottom: 8px;	z-index: 3;}.tab_page {	border: 1px solid #DDDDDD;	background: #FFFFFF;	padding: 10px;	display: block;	z-index: 2;	margin-bottom: 10px;}#footer {	width: 100%;	clear: both;	padding-top: 5px;	border-top: 1px solid #DDDDDD;}#footer .div1 {	float: left;	text-align: left;}#footer .div2 {	float: right;	text-align: right;}#category ul {	margin-top: 0px;	margin-bottom: 0px;	margin-left: 8px;	padding-left: 12px;	list-style: url('../image/bullet_1.png');}#information ul {	margin-top: 0px;	margin-bottom: 0px;	margin-left: 8px;	padding-left: 12px;	list-style: url('../image/bullet_2.png');}.cart {	border-collapse: collapse;	width: 100%;	border: 1px solid #EEEEEE;	margin-bottom: 10px;}.cart th {	background: #EEEEEE;	padding: 5px;	font-weight: normal;}.cart td {	padding: 5px;}

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Если я правильно понял проблему , то я лично себе менял расстояние между товарами добавлением :

cellspacing="5">

меняешь цифру "5" подстраиваясь под свои нужды

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

у него проблема не в том чтобы больше сделать расстояние, а наоборот, чтобы сократить, так что целлспейсинг тут не вариант)

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

А может ну его с этим резиновым шаблоном, :)) думаю только больше гемороя прибавит и везде по разному смотретсья будет, я тут подумал и решил остановитсья на разрешиний 1100 по ширине http://www.plexmall.com, все таки я футболки продовать буду, а контингент у меня подразумеваетсья что будет молодым, значит у них и моники с высоким разрешением, так что я думаю можно попасть в точку .. просто если меньше то не хватает места для 4 продуктов в ряд т еше и менюшкам по сторонам .. может кто позскажет как можно регулировать количество продуктов в ряд, ну чтоб можно было в ручную ставить, 3-4-5 ..

Fix305, Тебе особенное спасибo за терпение выслушать и желание помочь :()

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Подскажите можно ли как то поменять расстояние между продуктами в большую сторону? Уже замучилась мучаться)))) Заранее благодарю!

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.