sdld

Расположение опции-изображения

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

sdld    14

Добрый день, великие умы ОС :) Помогите привести расположение опций-изображений из вида post-20777-0-11339600-1346666296_thumb.jpg

в вид post-20777-0-36530600-1346666296_thumb.jpg Убиваю таблицу в product.tpl - становится в строку и все бы ничего но все кособокое, изображение слева, тыркалка и текст справа внизу за киломентр от изображения... При любом объединении в таблицу начинается выстраивание в вертикаль.. а без таблици ровного отображения достичь не получается...

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


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

с утра самого завис на этом моменту уже завою скоро =\ в css добавил float блоку option-image где-то выровнялось в линию, но большая часть поывадавливала соседние опции и перекосило все=\post-20777-0-32522900-1346668519_thumb.jpg

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


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

CSS:

.product-info .option-image {
border: 1px solid #d0e3ee;
    padding: 0px;
cursor: pointer;
}
.product-info .option-image label {
display: block;
width: 100%;
height: 100%;
margin-left: 5px;
}
.product-info .option-image img {
margin-right: 5px;
margin-bottom: -15px;
product.tpl

	    <?php if ($option['type'] == 'image') { ?>
	    <div id="option-<?php echo $option['product_option_id']; ?>" class="option">
		  <div align="center"><?php if ($option['required']) { ?>
		  <span class="required">*</span>
		  <?php } ?>
		  <b><?php echo $option['name']; ?>:</b></div><br />
			  <?php
		  $i = 0;
		  $len = count($option['option_value']);
		  foreach ($option['option_value'] as $option_value) {
		   if ($i == 0) {?>
    <div class="option-image">
    <table>
    <tr>
    <td colspan="2" rowspan="1" align="center">
    <label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><img src="<?php echo $option_value['image']; ?>" alt="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" /></label></td>
    </tr>
    <tr>
    <td>
    <input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" checked/></td>
    <td>
			    <label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><?php echo $option_value['name']; ?>
				    <?php if ($option_value['price']) { ?>
				    (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>)
				    <?php } ?>
				  </label></td>
	  </tr>
	  </table>
	  </div>
	  <br />
			  <?php } else { ?>
	 <div class="option-image">
    <table>
    <tr>
    <td colspan="2" rowspan="1" align="center">
    <label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><img src="<?php echo $option_value['image']; ?>" alt="<?php echo $option_value['name'] . ($option_value['price'] ? ' ' . $option_value['price_prefix'] . $option_value['price'] : ''); ?>" /></label></td>
    </tr>
    <tr>
    <td>
    <input type="radio" name="option[<?php echo $option['product_option_id']; ?>]" value="<?php echo $option_value['product_option_value_id']; ?>" id="option-value-<?php echo $option_value['product_option_value_id']; ?>" /></td>
    <td>
			    <label for="option-value-<?php echo $option_value['product_option_value_id']; ?>"><?php echo $option_value['name']; ?>
				    <?php if ($option_value['price']) { ?>
				    (<?php echo $option_value['price_prefix']; ?><?php echo $option_value['price']; ?>)
				    <?php } ?>
				  </label></td>
	  </tr>
	  </table>
	  </div>
	  </br>
	 <?php }
				  $i++;
		  }?>
	    </div>
	    <br />

Где копать подскажите пожалуйста

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


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

что то в это роде должно быть

.product-info .option-image {

border: 1px solid #d0e3ee;

padding: 0px;

cursor: pointer;

overflow: auto;

}

.product-info .option-image label {

display: block;

width: 50px;

margin-left: 5px;

float:left;

}

.product-info .option-image img {

margin-right: 5px;

margin-bottom: -15px;

лучьше дать ссылку

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


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

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

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


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

.product-info .options {overflow: auto;}

.product-info .option-image {

border: 1px solid #d0e3ee;

padding: 0px;

cursor: pointer;

width: 50px;

float:left;

}

так попробуй

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


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

что то в это роде должно быть

.product-info .option-image {

border: 1px solid #d0e3ee;

padding: 0px;

cursor: pointer;

overflow: auto;

}

.product-info .option-image label {

display: block;

width: 50px;

margin-left: 5px;

float:left;

}

.product-info .option-image img {

margin-right: 5px;

margin-bottom: -15px;

лучьше дать ссылку

непомогло,.. :(

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


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

.product-info .options {overflow: auto;}

.product-info .option-image {

border: 1px solid #d0e3ee;

padding: 0px;

cursor: pointer;

width: 50px;

float:left;

}

так попробуй

прикольная лесенка получилась, но нет )

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


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


.product-info .option {

clear: both;

}

.product-info .option br {

display: none;

}

.product-info .option-image {

width: 100px;

float: left;

}

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


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

балин, как-то же просто должно быть... и в див объединял и в таблицу и одинхрен через жопу все =

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


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

.product-info .option {
  clear: both;
}
.product-info .option br {
  display: none;
}
.product-info .option-image {
  width: 100px;
  float: left;
}
К сожалению тоже не помогло :( все в кучу собралось и съехало..

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


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

К сожалению тоже не помогло :( все в кучу собралось и съехало..

хотя уже лучше) только отступ дики до опций появился.. и все опции в линию выстроились)

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


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

можно так попробовать

.product-info .option br {
  display: none;
}
.product-info .option-image {
  width: 100px;
  float: left;
}
.product-info .option-image:last-child {
  float: none;
}
+ можно вместо .product-info .option-image указать конкретные опции через айди напр. .product-info #option-361, ...

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


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

Спасибо, друг! буду копаться! Очень благодарен!

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


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

новая потеха =\ clear: both; если не делать то все кривое, с ним получается пробел дикий сверху, если сделать очистку только в

.product-info .option-image br {

display: none;

}

а не

.product-info .option br {

display: none;

}

то все остальные опции отлично отображаются, а в имидже лесенка 1й строки..

post-20777-0-94621500-1346678221_thumb.jpg

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


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

+ можно вместо .product-info .option-image указать конкретные опции через айди напр. .product-info #option-361, ...

За это самое главное спасибо) это можно каждому товару свою опцию перекручивать :) Блин супер :)

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


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

А не проще табличное форматирование (tr,td) убрать и присвоить блоку что то типа


<div style="display:inline-block; border: 1px solid black; margin: 5px; padding: 15px; overflow:auto; text-align: center;">

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


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

А не проще табличное форматирование (tr,td) убрать и присвоить блоку что то типа

<div style="display:inline-block; border: 1px solid black; margin: 5px; padding: 15px; overflow:auto; text-align: center;">
этим способом получилось так post-20777-0-24044600-1346681208_thumb.jpg =(

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


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

этим способом получилось так post-20777-0-24044600-1346681208_thumb.jpg =(

А у меня вот так:
http://gun.opencart_ws/index.php?route=product/product&filter_name=ALFA%20model%20420%20(%D0%BD%D0%B8%D0%BA%D0%B5%D0%BB%D1%8C,%20%D0%B4%D0%B5%D1%80%D0%B5%D0%B2%D0%BE)&product_id=573
Только ссылку сайта как копировать будете, нижнее подчеркивание на точку замените, а то модеры домен, где администрирую в фильтр поставили...

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


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

да уже скопировал глянул, да сортирует.. у себя стили также настроил и в див объединил с темиже параметрами.. в итоге как на скрине всеравно только + еще рамка =

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


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

да уже скопировал глянул, да сортирует.. у себя стили также настроил и в див объединил с темиже параметрами.. в итоге как на скрине всеравно только + еще рамка =

Ну... бордернул так, для эффекта большего, положите сюда архивчик с TPL-кой, щас если откатаю, код выложу...

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


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

тплка...

product.zip

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


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

за;"№;№"""СЬ! СПАСИБО! С 8 УТРА ПАРЮСЬ!

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


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

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

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

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

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

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

Войти

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

Войти


  • Похожий контент

    • От seregin

      360.00 руб
      Скачать/Купить дополнение


      Опции и атрибуты в категориях (с обновлением цены)
      Модуль отображает опции и атрибуты на всех стандартных модулях и страницах с товарами.

      Совместим с Opencart: 2.1.0.1 - 3.0.2.0
      Совместим с ocStore: 2.1.0.1 - 2.3.0.2.3
       
      Не совместим с другими модулями изменяющие функционал опций товара.

      Демонстрация

      Главная страница — Перейти на сайт
      Административная панель – Перейти на сайт

      Доступ в административную панель:

      Логин - demo
      Пароль — demo

      Добавлены возможности:
      Обновление цены при выборе количества и опции Установка акции для цены опции. Выбор количества Автоматический выбор первой опции в группе Артикул для каждой опции Добавлен знак равно (=, /, *) в префиксе опции Показ всплывающего изображения при наведении на опцию с изображением  
      Подключение опций в модулях:
      Акции Новые поступления Рекомендуемые Хиты продаж  
      Подключение опций на страницах:
      Категории Поиск Производители Акции Продукт  
      Для нестандартных модулей необходимо сделать дополнительную адаптацию. Стоимость адаптации от 100 — 250 рублей в зависимости от количества модулей.
      Для стандартных модулей поддержка бесплатная.
      Перед установкой сделайте резервную копию сайта.
      Добавил seregin Добавлено 15.08.2016 Категория Опции Системные требования Сайт разработчика http://seregin-pro.ru/ Старая цена Метод активации Без активации Ioncube Loader Нет OpenCart 3.0
      2.3
      2.2
      2.1 ocStore 2.3
      2.2
      2.1 OpenCart.Pro, ocShop Не проверялось  
    • От seregin
      Модуль отображает опции и атрибуты на всех стандартных модулях и страницах с товарами.

      Совместим с Opencart: 2.1.0.1 - 3.0.2.0
      Совместим с ocStore: 2.1.0.1 - 2.3.0.2.3
       
      Не совместим с другими модулями изменяющие функционал опций товара.

      Демонстрация

      Главная страница — Перейти на сайт
      Административная панель – Перейти на сайт

      Доступ в административную панель:

      Логин - demo
      Пароль — demo

      Добавлены возможности:
      Обновление цены при выборе количества и опции Установка акции для цены опции. Выбор количества Автоматический выбор первой опции в группе Артикул для каждой опции Добавлен знак равно (=, /, *) в префиксе опции Показ всплывающего изображения при наведении на опцию с изображением  
      Подключение опций в модулях:
      Акции Новые поступления Рекомендуемые Хиты продаж  
      Подключение опций на страницах:
      Категории Поиск Производители Акции Продукт  
      Для нестандартных модулей необходимо сделать дополнительную адаптацию. Стоимость адаптации от 100 — 250 рублей в зависимости от количества модулей.
      Для стандартных модулей поддержка бесплатная.
      Перед установкой сделайте резервную копию сайта.
    • От griff188
      На один товар имеется две опции
      Например товар 1 опция 1 - 2 штуки
      товар 1 опция 2 - 3 штуки.
       
      Opencart дает заказать 10 штук каждой опции, независимо от остатков. То есть неверно понимает остатки по артикулам. Какой модуль тут может помочь? Как это допилить?
       
       
    • От Serg9988

      600.00 руб
      Скачать/Купить дополнение


      Уведомление о наличии PRO Opencart2
      Уведомление о наличии товара PRO
       
      Начиная с версии модуля 9.5, модуль работает только на opencart 2.3.* - 3.0* и OCStore 2.3.*
       
      Краткое описание:
      Модуль позволяет покупателю заказать уведомление о поступлении товара в магазин.
      Модуль заменяет кнопку "Купить" на кнопку "Уведомить", если товара нет на складе или выбранной покупателем опции у товара нет в наличии.
      Работает по:
      количеству товара на складе по количеству опций на товаре по статусу товара  
       
       

       
       
      Модуль  должен работать на большинстве шаблонов.
       
      К модулю идет инструкция где подробно описано как установить и настроить модуль. 
      Адаптация, правки вида модуля и другие работы на не стандартном шаблоне делаются за отдельную плату.
       
      ознакомится с документацией - ДОКУМЕНТАЦИЯ
       
      Системные/технические требования:
      Протестировано на следующих версиях : 
      ocstore 2.0*,2.1*,2.2*.2.3* opencart 2.0*,2.1*,2.2*.2.3*, 3.0*   Модуль не тестировался и его работа не гарантируется на всякого рода зборках ocstore или opencart от студий или отдельных разработчиков. Работа гарантируется только на чистых официальных сборках!
       
      Для работы модуля требуется:
      PHP Version: 5.6.x или выше
      ionCube PHP Loader: 4.5.0+ или выше
       
      Возможности:
       
       

       
       
      В планах реализовать:
      возможность создания собственных полей на форму с возможностью использовать их в письмах отправка уведомлений по смс построение отчетов по заявкам и выгрузка из в Exsel  
       
      Дизайн модуля адаптивен и корректно работает на мобильных устройствах:
       

       
      Установка:
       Скачайте архив с нужной версией модуля. Модуль с версии 9.5 работает только на opencart 2.3 и выше и OCStore 2.3 и выше.  Зайдите в административную панель сайта в раздел "Дополнения/Установка дополнений" и установите модуль  Зайдите в раздел "Дополнения/Менеджер дополнений" и обновите кеш  Зайдите в раздел "Дополнения/Дополнения/Модули" Установите модуль "SM Уведомить о наличии PRO"  Зайдите в редактирование модуля (введите ключ активации или сделайте запрос на получение ключа ) активируйте модуль переведя опцию "Статус" в позицию "Включен.              Сохраните настройки  Подключите модуль на страницы Главная, категории, товары и тд. (Раздел Дизайн/Схемы)  
      Состав модуля:
      полная инструкция с описанием работы и установки модуля; файлы модуля; файл для тестирования настроек сервера;  
      ДЕМО
      Страница товара с опциями (кнопка купить будет подменена только если выбрать опцию количество которой <=0)
      login/pass - demo/demo
       
      Полное описание:
       
      Все работы по стилизации модуля под ваш шаблон (цвет кнопки, форма размер и тд.) проводяться исключительно на платной основе.
       
      Что нового:
       
      Обновление:
       
      Условия использования:
      Лицензия на модуль выдается на следующих условиях:
      1 лицензия = 1 покупка = 1 доменное имя.
      То есть - один раз купив, вы получаете ключ для работы модуля только на одном доменном имени, одном магазине!
       
      Приобретая лицензию (покупая дополнение), Вы автоматически соглашаетесь со следующими положениями:
       
      Для получения лицензионного ключа напишите мне в личном сообщении от имени того, на кого покупался модуль:
      Название модуля Доменное имя вашего магазина Доменное имя тестовой площадки (если таковая имеется) Ваш адрес электронной почты, куда выслать ключ  
      Дополнительные лицензии вы можете получить купив модуль на сайте http://myopencart.club/
      На 4-ю и более покупку действует скидка. Чтобы получить скидку пишите в личку или на почту.
      Вопросы, пожелания можно писать в форум или на почту support@myopencart.club
       
      Добавил Serg9988 Добавлено 30.03.2016 Категория Письма, почта, рассылки, sms Системные требования Ioncube Loader 4.5.0+ Сайт разработчика http://myopencart.club Старая цена Метод активации По запросу в ЛС Ioncube Loader Требуется OpenCart 3.0
      2.3
      2.2
      2.1
      2.0 ocStore 2.3
      2.2
      2.1 OpenCart.Pro, ocShop Не проверялось  
    • От Serg9988
      Уведомление о наличии товара PRO
       
      Начиная с версии модуля 9.5, модуль работает только на opencart 2.3.* - 3.0* и OCStore 2.3.*
       
      Краткое описание:
      Модуль позволяет покупателю заказать уведомление о поступлении товара в магазин.
      Модуль заменяет кнопку "Купить" на кнопку "Уведомить", если товара нет на складе или выбранной покупателем опции у товара нет в наличии.
      Работает по:
      количеству товара на складе по количеству опций на товаре по статусу товара  
       
       

       
       
      Модуль  должен работать на большинстве шаблонов.
       
      К модулю идет инструкция где подробно описано как установить и настроить модуль. 
      Адаптация, правки вида модуля и другие работы на не стандартном шаблоне делаются за отдельную плату.
       
      ознакомится с документацией - ДОКУМЕНТАЦИЯ
       
      Системные/технические требования:
      Протестировано на следующих версиях : 
      ocstore 2.0*,2.1*,2.2*.2.3* opencart 2.0*,2.1*,2.2*.2.3*, 3.0*   Модуль не тестировался и его работа не гарантируется на всякого рода зборках ocstore или opencart от студий или отдельных разработчиков. Работа гарантируется только на чистых официальных сборках!
       
      Для работы модуля требуется:
      PHP Version: 5.6.x или выше
      ionCube PHP Loader: 4.5.0+ или выше
       
      Возможности:
       
       

       
       
      В планах реализовать:
      возможность создания собственных полей на форму с возможностью использовать их в письмах отправка уведомлений по смс построение отчетов по заявкам и выгрузка из в Exsel  
       
      Дизайн модуля адаптивен и корректно работает на мобильных устройствах:
       

       
      Установка:
       Скачайте архив с нужной версией модуля. Модуль с версии 9.5 работает только на opencart 2.3 и выше и OCStore 2.3 и выше.  Зайдите в административную панель сайта в раздел "Дополнения/Установка дополнений" и установите модуль  Зайдите в раздел "Дополнения/Менеджер дополнений" и обновите кеш  Зайдите в раздел "Дополнения/Дополнения/Модули" Установите модуль "SM Уведомить о наличии PRO"  Зайдите в редактирование модуля (введите ключ активации или сделайте запрос на получение ключа ) активируйте модуль переведя опцию "Статус" в позицию "Включен.              Сохраните настройки  Подключите модуль на страницы Главная, категории, товары и тд. (Раздел Дизайн/Схемы)  
      Состав модуля:
      полная инструкция с описанием работы и установки модуля; файлы модуля; файл для тестирования настроек сервера;  
      ДЕМО
      Страница товара с опциями (кнопка купить будет подменена только если выбрать опцию количество которой <=0)
      login/pass - demo/demo
       
      Полное описание:
       
      Все работы по стилизации модуля под ваш шаблон (цвет кнопки, форма размер и тд.) проводяться исключительно на платной основе.
       
      Что нового:
       
      Обновление:
       
      Условия использования:
      Лицензия на модуль выдается на следующих условиях:
      1 лицензия = 1 покупка = 1 доменное имя.
      То есть - один раз купив, вы получаете ключ для работы модуля только на одном доменном имени, одном магазине!
       
      Приобретая лицензию (покупая дополнение), Вы автоматически соглашаетесь со следующими положениями:
       
      Для получения лицензионного ключа напишите мне в личном сообщении от имени того, на кого покупался модуль:
      Название модуля Доменное имя вашего магазина Доменное имя тестовой площадки (если таковая имеется) Ваш адрес электронной почты, куда выслать ключ  
      Дополнительные лицензии вы можете получить купив модуль на сайте http://myopencart.club/
      На 4-ю и более покупку действует скидка. Чтобы получить скидку пишите в личку или на почту.
      Вопросы, пожелания можно писать в форум или на почту support@myopencart.club
       
  • Последние посетители   0 пользователей онлайн

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