Как распространить дизайн блока промо на разные страницы?

голоса: 0
Доброе время!  Пролетарии всех стран, соединяйтесь!  Пытаюсь вернуться к нашим баранам и продолжить редактирование дизайна страниц через PROMO-блок, с использованием методики "Copy-Paste", т.е. так же, как получилось перенести дизайн шаблона 1-й страницы на 2-ю, с последующ0им редактированием элементов в PROMO-блоке, однако, по какой-то причине, шаблон 1-й страницы не переносится на 3-ю...  изменяю в блоке дизайна страницы только <?if($PAGE_ID$='sitePage2')?> на <?if($PAGE_ID$='main')?> после <?endif?> второй страницы, как то ID страницы, взятый в ПУ...  не подскажете в чём прикол?
Адрес сайта kirashop.ucoz.net/
Закрыто с пометкой: Вопрос решен!
| Автор: | Категория: Дизайн сайта
Закрыт | | Автор: Yuri_Geruk

Ответов: 1

голоса: 0
Покажите текущий код вашего блока промо, здесь предоставьте и уточните ссылки на страницы где вы хотите отображать отдельное содержимое с блока промо.
| Автор:

<?if($PAGE_ID$='sitePage1')?>
<section class="slider1">
 <div class="slider-wrapper">
 <div class="slide">
 <div class="photo">
 <img src="https://kirashop.ucoz.net/Somtawinrat_Rd_120.jpg" alt="photo">
 </div>
 <div class="text-block">
 <div>
 <h1>Ethnic Style Clothes & Accessories</h1>
 <p>Everything about traditional outfits is completely different and unique with each one having its own charisma. The ever-growing world of ethnic fashion where choices are endless, it becomes hard to go with the ‘best’ one. For those who are unaware of such outfits, we have numerous options that are open to all the shoppers</p>
 <a href="https://kirashop.ucoz.net/index/ethnic_style_clothes_magic_shop/0-8" class="info-btn">More</a>
 </div>
 </div>
 </section>
 <section class="slider2">
 <div class="carousel-wrapper">
 <div class="slide-c">
 <div class="img-wrapp"><img src="https://kirashop.ucoz.net/2588_n.jpg" alt="cover"></div>
 <div class="title"><a href="https://kirashop.ucoz.net/index/ethnic_style_clothes_magic_shop/0-8">Ethnic Style Magic Shop</a></div>
 </div>
 ....................................................................... дальше идёт карусель до:
 <div class="slide-c">
 <div class="img-wrapp"><img src="https://kirashop.ucoz.net/pic_7.png" alt="cover"></div>
 <div class="title"><a href="https://kirashop.ucoz.net/index/ethnic_style_clothes_magic_shop/0-8">Ethnic Style Magic Shop</a></div>
 </div>
 </div>
 </section>
 <script src="/.s/t/1718/jquery.bxslider.min.js"></script>
 <script>
 $(function () {
 $('.slider-wrapper').bxSlider({
 useCSS: false,
 nextText: 'keyboard_arrow_right',
 prevText: 'keyboard_arrow_left'
 });
 $('.carousel-wrapper').bxSlider({
 useCSS: false,
 nextText: 'keyboard_arrow_right',
 prevText: 'keyboard_arrow_left',
 minSlides: 2,
 maxSlides: 7,
 slideWidth: 138,
 slideMargin: 8,
 autoStart: true,
 autoHover: true
 });
 });
 </script>
<?endif?>

это код первой (по счёту) страницы с ID "sitePage1"

код 2-й (по счёту) страницы, с ID "sitePage2" завёл после <?endif?> кода первой страницы, потом поменял в нём ссылки на фото и текст э это стало работать...

сейчас пытаюсь сделать то же самое для последующих страниц, меняя ID страницы в коде <?if($PAGE_ID$='sitePage1')?> (в том же PROMO-блоке) но это, почему то, больше не работает...

Alex Q,

Не дублируйте в каждом условии скрипт слайдера:

 <script src="/.s/t/1718/jquery.bxslider.min.js"></script>
 <script>
 $(function () {
 $('.slider-wrapper').bxSlider({
 useCSS: false,
 nextText: 'keyboard_arrow_right',
 prevText: 'keyboard_arrow_left'
 });
 $('.carousel-wrapper').bxSlider({
 useCSS: false,
 nextText: 'keyboard_arrow_right',
 prevText: 'keyboard_arrow_left',
 minSlides: 2,
 maxSlides: 7,
 slideWidth: 138,
 slideMargin: 8,
 autoStart: true,
 autoHover: true
 });
 });
 </script>

вынесите его за пределы условия в самый низ, в условиях дублируйте лишь блок с текстом и фото:

<?if($PAGE_ID$='sitePage1')?>
<section class="slider1">
 <div class="slider-wrapper">
 <div class="slide">
 <div class="photo">
 <img src="https://kirashop.ucoz.net/Somtawinrat_Rd_120.jpg" alt="photo">
 </div>
 <div class="text-block">
 <div>
 <h1>Ethnic Style Clothes & Accessories</h1>
 <p>Everything about traditional outfits is completely different and unique with each one having its own charisma. The ever-growing world of ethnic fashion where choices are endless, it becomes hard to go with the ‘best’ one. For those who are unaware of such outfits, we have numerous options that are open to all the shoppers</p>
 <a href="https://kirashop.ucoz.net/index/ethnic_style_clothes_magic_shop/0-8" class="info-btn">More</a>
 </div>
 </div>
 </section>
 <section class="slider2">
 <div class="carousel-wrapper">
 <div class="slide-c">
 <div class="img-wrapp"><img src="https://kirashop.ucoz.net/2588_n.jpg" alt="cover"></div>
 <div class="title"><a href="https://kirashop.ucoz.net/index/ethnic_style_clothes_magic_shop/0-8">Ethnic Style Magic Shop</a></div>
 </div>
 ....................................................................... дальше идёт карусель до:
 <div class="slide-c">
 <div class="img-wrapp"><img src="https://kirashop.ucoz.net/pic_7.png" alt="cover"></div>
 <div class="title"><a href="https://kirashop.ucoz.net/index/ethnic_style_clothes_magic_shop/0-8">Ethnic Style Magic Shop</a></div>
 </div>
 </div>
 </section>
 <?endif?>

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

оу...  ок, про лимит не знал, спасибо, пробую...
Alex Q,
помогло, всё работает, спасибо!  а если количество символов HTML-кода всех необходимых для редактирования страниц превышает допустимый лимит, кроме как в PROMO-блоке, в каких ещё разделах можно редактировать дизайн страницы?  в секции "Модули" возможно редактирование только текстового блока для вывода информации, в секции "Дизайн/Редактор/Страницы сайта" можно видеть только общую форму текстовой части страницы с блоками вывода информации, но как применить иную редакцию шаблона к определённой конкретной странице - не совсем понятно...
Alex Q,
при создании страницы в редакторе страниц есть опция отдельного дизайна для данной страницы. твких страниц можно создать 20. после подключения опции стрвница появляется в списке шаблонов, после этого шаблон данной страницы можно редактировать как угодно
webanet,
да, я как раз такую страницу и создал в разделе "Модули", сейчас распространил на неё дизайн шаблона, но сделал это через PROMO-блок, т.к. в разделе "Модули", провалившись в эту, либо какую-либо другую из отражённых там страниц, я могу редактировать только код текстового блока, добавлять фото, т.п., но общий дизайн оформления страницы (шаблона) можно редактировать только через PROMO-блок, в чём и был, собственно, вопрос...
доброго времени, просьба сообщить в каком разделе инструкции находится информация о виджетах с фото, кратким описанием, ценой продукта, по типу "Card", как в Ukit, или подобных, чтобы разместить их на страницах сайта
Alex Q,
таких виджетов нет на юкоз. вам наверное лучше создать сайт на юкит
webanet,

оу... но мне Ucoz привычней, может есть возможность добавления фото с описанием, линком на ресурс, по типу кнопки, т.п. в каком то определённом порядке, таблице, т.п?

как можно добавить фото в шаблон страницы, чтобы оно помещалось целиком, а не обрезанным?

https://kirashop.ucoz.net/index/site-info/0-2

Alex Q,
  • > Распространить шаблон страницы
  • >> Не стоит создавать копии вопросов если текущий открыт, это не ускорит решение. Вам был дан пример как делать и код пример предоставлен, вы же все кратко описываете без примеров, что прописали, на каких страницах проверяли (ссылки), от вас никаких подробностей. Жду более подробного описания, с примерами что вами сделано в блоке промо и где проверяете результат работы.
Yuri_Geruk,

главная страница: https://kirashop.ucoz.net/

<?if($PAGE_ID$='sitePage1')?>
<section class="slider1">
 <div class="slider-wrapper">
 <div class="slide">
 <div class="photo">
 <img src="https://kirashop.ucoz.net/Somtawinrat_Rd_120.jpg" alt="photo">
 </div>
 <div class="text-block">
 <div>
 <h1>Ethnic Style Clothes & Accessories</h1>
 <p>Everything about traditional outfits is completely different and unique with each one having its own charisma. The ever-growing world of ethnic fashion where choices are endless, it becomes hard to go with the ‘best’ one. For those who are unaware of such outfits, we have numerous options that are open to all the shoppers</p>
 <a href="https://kirashop.ucoz.net/index/ethnic_style_clothes_magic_shop/0-8" class="info-btn">More</a>
 </div>
 </div>
 </section>
 <section class="slider2">
 <div class="carousel-wrapper">
 <div class="slide-c">
 <div class="img-wrapp"><img src="https://kirashop.ucoz.net/4128_n.jpg" alt="cover"></div>
 <div class="title"><a href="https://kirashop.ucoz.net/index/ethnic_style_clothes_magic_shop/0-8">Ethnic Style Magic Shop</a></div>
 </div>

............................. карусель

 </div>
 </section>
 <?endif?>

страница: Site Info ($PAGE_ID$ - sitePage2) https://kirashop.ucoz.net/index/site-info/0-2

<?if($PAGE_ID$='sitePage2')?>

далее всё следует аналогично коду предыдущей страницы...

<?endif?>

страница: File Catalog ($URL_ID$ - ldMain; $PAGE_ID$ - main; $MODULE_ID$ - load) https://kirashop.ucoz.net/load/

нижеприведённый код не выводит дизайн шаблона, который выводится в двух предыдущих и последней (sitePage8) страницах, только дизайн верхней части с лого, как и на 6-ти последующих страницах (ссылки следуют)


<?if($PAGE_ID$='main')?>


далее всё следует аналогично коду предыдущей страницы...

<?endif?>

страницы: 

Publisher - https://kirashop.ucoz.net/publ/

Blog - https://kirashop.ucoz.net/blog/

Forum - https://kirashop.ucoz.net/forum/

Photo Albums - https://kirashop.ucoz.net/photo/

Guestbook - https://kirashop.ucoz.net/gb

Contact Us - https://kirashop.ucoz.net/index/0-3

даже не пытался проверить

страница, которая была создана самостоятельно: Ethnic Style Clothes Magic Shop ($PAGE_ID$ - sitePage8) -  https://kirashop.ucoz.net/index/ethnic_style_clothes_magic_shop/0-8

выводит заданный дизайн по всем параметрам:

<?if($PAGE_ID$='sitePage8')?>

далее всё следует аналогично коду предыдущей страницы...

<?endif?>

 <script src="/.s/t/1718/jquery.bxslider.min.js"></script>
 <script>
 $(function () {
 $('.slider-wrapper').bxSlider({
 useCSS: false,
 nextText: 'keyboard_arrow_right',
 prevText: 'keyboard_arrow_left'
 });
 $('.carousel-wrapper').bxSlider({
 useCSS: false,
 nextText: 'keyboard_arrow_right',
 prevText: 'keyboard_arrow_left',
 minSlides: 2,
 maxSlides: 7,
 slideWidth: 138,
 slideMargin: 8,
 autoStart: true,
 autoHover: true
 });
 });
 </script>

все коды следуют последовательно вниз, по порядку страниц, скрипт карусели перенесён в самый низ и не повторяется, как Вы сказали, но шаблон работает только на 1й, 2й и 8й страницах, которые поддерживает заданный дизайн

вопрос открывал заново, потому как вопрос с темой переноса шаблона был закрыт, т.к., сработала корректировка $PAGE_ID$ по Вашему совету и дизайн стал отображаться на 2-й странице, я и обрадовался, что всё заработает, но последующих пара вопросов, заданных Вашей коллеге, так и остались открытыми, вместо того мне настойчиво советуют сменить Ucoz на Ukit...

Alex Q,
Скиньте полный код в файл на гугл диске и ссылку на файл с доступом здесь предоставьте.
Yuri_Geruk,
а на e-mail можно?
Alex Q,
Можно, майл в профиле найдете.
Yuri_Geruk,
отправил в форме на сайте
Alex Q,

В блоге не работает так как в шаблоне главной модуля https://kirashop.ucoz.net/panel/?a=tmpl;m=7;t=1 или странице архива https://kirashop.ucoz.net/panel/?a=tmpl;m=7;t=2 нет кода $GLOBAL_PROMO$ Сразу же после кода:

$GLOBAL_AHEADER$

должен быть код:

<section id="casing">$GLOBAL_PROMO$

выделил красным, так должно быть. На других страницах как вижу работает все.

Yuri_Geruk,

спасибо, я долго не мог вспомнить где находил этот раздел...

$GLOBAL_AHEADER$
    
 <section id="casing">$GLOBAL_PROMO$

всё так и сделал, но всё осталось по прежнему...

в главной странице модуля и странице архива были отступы между строками $GLOBAL_AHEADER$ и  <section id="casing"> - так и оставил, или может надо было сдвинуть вплотную?

Alex Q,

В блоге заработало https://kirashop.ucoz.net/blog/ Вы говорите не помогло))

Yuri_Geruk,
оХХХ... такидА, спасибо! )  но почему то <?if($PAGE_ID$='main')?> для блога тот же, что и для каталога но каталог. походу оказался для кода ближе по духу, потому как по порядку дальше и я в него даже и не смотрел..)  а можно $PAGE_ID$ изменить вручную в Конструкторе меню?
Alex Q,

Для каталога файлов для главной:

<?if($URI_ID$='ldMain')?>

для блога для главной:

<?if($URI_ID$='blMain')?>

Yuri_Geruk,

да, но в PROMO то мы прописываем не $URI_ID$ а $PAGE_ID$ который одинаковый для этих двух страниц, поэтому в какой то из них его нужно изменить... если можно

я ещё добавил $GLOBAL_PROMO$ так же и для остальных страниц в том же месте в разделе Редактирование шаблонов или не надо было?

Alex Q,
Для главных модулей используйте лучше $URI_ID$ не $PAGE_ID$ и соответственно копируйте нужный идентификатор напротив в панели инструментов.
Yuri_Geruk,

в PROMO мы прописываем коды $PAGE_ID$ или надо $URI_ID$?

Alex Q,
Если для страниц модуля редактор страниц, лучше $PAGE_ID$, а для других модулей лучше $URI_ID$ так как он более точно фиксирует айди страниц в отличие от $PAGE_ID$ у которого идентификаторы совпадают с главными других модулей.
Yuri_Geruk,

т.е. в PROMO-блоке надо записать:

<?if($URL_ID$='ldMain')?>
<section class="slider1">
 <div class="slider-wrapper">
 <div class="slide">
 <div class="photo">
 <img src="https://kirashop.ucoz.net/1392_n.jpg" alt="photo">
 </div>...

вместо:

<?if($PAGE_ID$='main')?>
<section class="slider1">
 <div class="slider-wrapper">
 <div class="slide">
 <div class="photo">
 <img src="https://kirashop.ucoz.net/1392_n.jpg" alt="photo">
 </div>...

?

Alex Q,
Ставить то, что написано в поляx на нужной странице http://joxi.ru/RmzEX0atRNL7Lr
Yuri_Geruk,

ок, но тогда получается надо изменить весь шаблон PROMO и вместо $PAGE_ID$ = 'значение' вписывать $URL_ID$='значение'... так?

...проверил - $URL_ID$='значение' в PROMO не работает

Alex Q,
Я вам выше несколько раз ответил, если вы не хотите сами проверять свои айди и правильно их прописать, я за вас не проверю и не пропишу.
Yuri_Geruk,

"...Если для страниц модуля редактор страниц, лучше $PAGE_ID$, а для других модулей лучше $URI_ID$ так как он более точно фиксирует айди страниц в отличие от $PAGE_ID$ у которого идентификаторы совпадают с главными других модулей"

- я Вас несколько раз спросил что нужно прописать в PROMO-блоке,

НЕ в модуле редактор страниц.

НЕ в других модулях,

а именно в PROMO-блоке, который я использую для переноса дизайна шаблона главной страницы на другие страницы сайта, если там принимается ТОЛЬКО $PAGE_ID$, который почему то получился одинаковым для 2-х страниц сайта

Alex Q,
  1. Вы в блоке промо используете условия для вывода содержимого на других страницах, надеюсь вы это понимаете.
  2. Использовать лучше всего оператор $URI_ID$ и прописывать айди который будет напротив него на нужной вам странице, который можно посмотреть в панели инструментов http://joxi.ru/RmzEX0atRNL7Lr
  3. $PAGE_ID$ так работает для главных модулей потому там и один и тот же айди main из-за чего я и советую использовать $URI_ID$ где идентификатор main не будет дублироваться, так как для разных модулей он отличается.

Ничего сверхсложного нет, я же об этом выше уже говорил. Читайте внимательно, проверяйте айди и составляйте условия для нужных вам страниц, вот и все...

Yuri_Geruk,

блиННН... я то всё это время пытался писать $URL_ID$ вместо $URI_ID$... сорри, спасибо! вроде как заработало...)

подскажите плз где можно прочитать об особенностях добавления фото с описанием, линками на страницы/разделы, пр.

возможно это в каких-то платных формах, я мельком встретил вопросы по добавлению прайс-листа с фото вчера как искал информацию об особенностях размещения фото, в определённых формах типа "Table", ибо никак не мог угадать размеры для их оптимального расположения в этой форме... мы планируем соорудить сайт магазина пока в принципе, потом заняться его платными разделами и SEO, после карантина, сейчас пока нет смысла, ибо продавец сидит дома на самоизоляции...

Alex Q,

Пример как это реализуется можете посмотреть здесь https://ru.stackoverflow.com/questions/633152

Yuri_Geruk,

спасибо!

а с $URI_ID$='ldMain' для https://kirashop.ucoz.net/load/ всё таки что-то не то... не выводит заданный шаблон

выводит в блоге, но ни в https://kirashop.ucoz.net/load/ ни в https://kirashop.ucoz.net/publ/ не хочет...

Alex Q,

Не выводит так как вероятно у вас как и на главной блога так и в каталога на главной и в статьях нет кода:

<section id="casing">$GLOBAL_PROMO$

проверяйте.

Yuri_Geruk,
уже есть везде, где только можно...  ...стоп, походу в каталоге не сохранилось - истёк период сессии  ...ещё раз блиННН сорри, я добавлял этот код, переходя на следующие страницы и только в конце сохранял, а надо было на каждой...  походу  ещё раз спасибо!
Yuri_Geruk,
Доброго времени,  тут снова нескладушки в PROMO - пишет превышен лимит на размер шаблона Globo, тогда как символов с пробелами только 45801...
Alex Q,
Имейте ввиду, что считает символы так же и внутри скрипта который подгружается в шаблоне. Если пишет о лимите, значит достигли вы его, то что вы посчитали, это одно дело, а то что пишет внутри шаблона, это другое, я вам ранее о лимите говорил, вот и достигли))
Yuri_Geruk,
оу... так посчитал вроде полностью со скриптом и потом он по любому не займёт 30 тыс...
Alex Q,
Не нужно самому считать, за вас uCoz подсчитал.
Yuri_Geruk,
ммм... а в каком же туле тогда ориентироваться для подсчёта символов, чтобы понимать когда будет превышен тот лимит, который считает uCoz?
Alex Q,
Просто не делать с страницы простыню в несколько метров, такие страницы мало кто дочитывает (просматривает) до конца.
Yuri_Geruk,
дык... там и не простыня вовсе, просто карусель походу много места занимает
Yuri_Geruk,

Доброго времени,

Спасибо деду за победу!

Дошли наконец руки до редактирования шаблонов текстовых блоков страниц, с целью, снова таки, переноса на сей раз кода страницы фотоальбома с добавлением фото, как нашёл на форуме: "...в маленьком формате, чтобы при нажатии на изображение открывалось большое фото которое содержит описательную часть и даёт возможность пересматривать все фото из этого раздела одно за одним..." но в описательную часть хочу добавить ещё ссылку на позицию в прайс-листе, который будет размещён в последующей платной версии...

на форуме встретил один совет:

<a href="ссылка на картинку" class="ulightbox" data-fancybox-group="ultbx">
<img src="ссылка на картинку"></a>

но теперь не могу найти то поле HTML-кода, куда необходимо вставить этот код, заходя в: Дизайн/Шаблон/Photo Albums, а там... теряюсь в 10 подразделах, но ни в одном не могу найти HTML-код только что добавленных фото через визуальный редактор, чтобы его таки поменять на вышеуказанный с последующим распространением на другие страницы...

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

Хелп плиз!

Alex Q,

Правильный совет. Ищите у себя фото которые размещены кодом вида:

<img src="https://kirashop.ucoz.net/P90915-131115.jpg">

и делаем в итоге:

<a href="https://kirashop.ucoz.net/P90915-131115.jpg" class="ulightbox" data-fancybox-group="ultbx"><img src="https://kirashop.ucoz.net/P90915-131115.jpg"></a>

и так делаем для всех фото на нужных вам страницах сайта.

Yuri_Geruk,

в том то и дело, что не могу найти этот код во всех 10 подразделах Photo Albums, вижу только один одинаковый код...

<html>
<head>
 <meta charset="utf-8">
 <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
 <title>$CAT_NAME$ <?if($SECTION_NAME$)?>- $SECTION_NAME$<?endif?> - $MODULE_NAME$ - $SITE_NAME$</title>
 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
 <link href='https://fonts.googleapis.com/css?family=Material+Icons|Ubuntu:300,300i,400,400i,500,700&amp;subset=cyrillic' rel='stylesheet' type='text/css'>
 <?if($MODULE_ID$ != 'shop')?>
 <link type="text/css" rel="StyleSheet" href="/.s/src/shop.css"/>
 <style>
 @font-face {
 font-family: "FontAwesome";
 font-style: normal;
 font-weight: normal;
 src: url("/.s/src/font/fontawesome-webfont.eot?#iefix&v=4.3.0") format("embedded-opentype"), url("/.s/src/font/fontawesome-webfont.woff2?v=4.3.0") format("woff2"), url("/.s/src/font/fontawesome-webfont.woff?v=4.3.0") format("woff"), url("/.s/src/font/fontawesome-webfont.ttf?v=4.3.0") format("truetype"), url("/.s/src/font/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular") format("svg");
 }
 </style>
 <?endif?>
 <link type="text/css" rel="StyleSheet" href="/.s/src/css/1718.css"/>
 <script type="text/javascript">
 var currentPageIdTemplate = '$PAGE_ID$';
 var currentModuleTemplate = '$MODULE_ID$';
 </script>
</head>
<body class="base">
<div class="cont-wrap">
 $GLOBAL_AHEADER$

 <section id="casing">$GLOBAL_PROMO$
 <!-- <global_promo> -->
 <?if($PAGE_ID$='sitePage1')?>
 <section class="slider1">
 <div class="slider-wrapper">
 <div class="slide">
 <div class="photo">
 <img src="/.s/t/1718/slider1.jpg" alt="photo">
 </div>
 <div class="text-block">
 <div>
 <h1>Lorem ipsum dolor</h1>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus aliquam aspernatur consequatur corporis doloribus eligendi eos facilis, id impedit in molestias odio odit porro quae rem sequi sit, soluta vero.</p>
 <a href="#" class="info-btn">More</a>
 </div>
 </div>
 </div>
 <div class="slide">
 <div class="photo">
 <img src="/.s/t/1718/slider1.jpg" alt="photo">
 </div>
 <div class="text-block">
 <div>
 <h1>Lorem ipsum dolor</h1>
 <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus aliquam aspernatur consequatur corporis doloribus eligendi eos facilis, id impedit in molestias odio odit porro quae rem sequi sit, soluta vero.</p>
 <a href="#" class="info-btn">More</a>
 </div>
 </div>
 </div>
 <div class="slide">
 <div class="photo">
 <img src="/.s/t/1718/slider1.jpg" alt="photo">
 </div>
 <div class="text-block">
 <div>
 <h1>Lorem ipsum dolor</h1>...................

 </section>
 <script src="/.s/t/1718/jquery.bxslider.min.js"></script>
 <script>
 $(function () {
 $('.slider-wrapper').bxSlider({
 useCSS: false,
 nextText: 'keyboard_arrow_right',
 prevText: 'keyboard_arrow_left'
 });
 $('.carousel-wrapper').bxSlider({
 useCSS: false,
 nextText: 'keyboard_arrow_right',
 prevText: 'keyboard_arrow_left',
 minSlides: 2,
 maxSlides: 7,
 slideWidth: 138,
 slideMargin: 8,
 autoStart: true,
 autoHover: true
 });
 });
 </script>
 <?endif?>
 <!-- </global_promo> -->
 <div class="wrapper">
 <?if($MODULE_ID$='forum')?><div class="forum-box"><?endif?>
 <!-- <middle> -->
 <div id="content" <?if($HIDE_CLEFTER$)?>class="wide-page"<?endif?>>
 <section class="module-$MODULE_ID$"><!-- <body> --><div class="breadcrumbs-wrapper">
 <div class="breadcrumbs"><a href="$HOME_PAGE_LINK$"><!--<s5176>-->Home<!--</s>--></a> &raquo; <a href="$MODULE_URL$"><!--<s5169>-->Photo album<!--</s>--></a> <?if($SECTION_NAME$)?>&raquo; <a href="$SECTION_URL$">$SECTION_NAME$</a><?endif?> &raquo; $CAT_NAME$</div>
</div>
<div class="items-stat-wrapper">
 <div class="items-stat"><?if($NUM_ENTRIES$)?><!--<s5226>-->Photos in section<!--</s>-->: <b>$NUM_ENTRIES$</b><?endif?></div>
 <?if($PAGE_SELECTOR$)?><div class="paging-wrapper-top"><!--<s3015>-->Pages<!--</s>-->: $PAGE_SELECTOR$</div><?endif?>
</div><hr />
$BODY$<hr/>
<?if($PAGE_SELECTOR1$)?><div class="paging-wrapper-bottom">$PAGE_SELECTOR1$</div><?endif?><!-- </body> --></section>
 </div>
 <?if(!$HIDE_CLEFTER$)?>
 <aside>
 <div id="sidebar">
 <div class="sidebox">
 <div class="inner">
 <div style="text-align:center;"><?if($USERS_ON$)?>
 <?if($USER_LOGGED_IN$)?>
 <span><!--<s5212>-->Welcome<!--</s>-->, <a href="$PERSONAL_PAGE_LINK$">
 <b>$USERNAME$</b></a>!
 </span>
 <?else?>
 <span><!--<s5212>-->Welcome<!--</s>-->, <b>$USERNAME$</b>!</span>
 <?endif?>
 <br><?endif?>
 <?if($USERS_ON$)?>
 <?if($USER_LOGGED_IN$)?>
 <a title="My profile"href="$PERSONAL_PAGE_LINK$"><!--<s5214>-->My profile<!--</s>--></a>
 |
 <a title="Log out" href="$LOGOUT_LINK$"><!--<s5164>-->Log out<!--</s>--></a>
 <?else?>
 <a title="Sign Up" href="$REGISTER_LINK$"><!--<s3089>-->Sign Up<!--</s>--></a>
 |
 <a title="Log In" href="$LOGIN_LINK$"><!--<s3087>-->Log In<!--</s>--></a>
 <?endif?>
 <?endif?>
 </div>
 </div>
 <div class="clr"></div>
 </div>
 $GLOBAL_CLEFTER$
 </div>
 </aside>
 <?endif?>
 <!-- </middle> -->
 <div class="clr"></div>
 <?if($MODULE_ID$='forum')?></div>
 <?endif?>
</div>
</div>
$GLOBAL_BFOOTER$
</div>

<script src="/.s/t/1718/main.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/webfont/1.6.26/webfont.js"></script>
</body>
</html>

Yuri_Geruk,
редактирование HTML-кода текстовой (переменной) части страницы (не шаблона страницы целиком - с этим мы уже разобрались) возможно только на 4-х страницах сайта:  Home Page  Site Info (добавил фото с вышеуказанным кодом - получилось прикольно, пытаюсь дальше усовершенствовать...)  Contact Us  Ethnic Style Garments Magic Shop - страница, созданная самостоятельно с заданным дизайном  на других страницах HTML-кода в этой (переменной) части не вижу в принципе...
Alex Q,
В вашем случае нужно именно редактировать страницы отдельно, не шаблон, как вы и сделали.
Yuri_Geruk,
да, но проблема в том, что в редакторе страниц есть поле для HTML-кода только тех 4-х страниц, которые я указал выше, остальные находятся в секции "Модули" раздела "Модули", не всекции "Страницы" и при попытке входа в них с этой секции не отражают поля HTML-кодов...
Alex Q,
Не нужно искать в глобальных блоках, нужно открывать на редактирование страницы и там искать, вы прописали ссылки на фото вручную без прикрепления через доп поля не в глоб блоках.
Yuri_Geruk,

так я ж о чём и говорю, если вручную, то скажем на странице фотоальбома есть только поле для добавления фото, на странице форума только поле для сообщений форума, но не для редактирования HTML-кода...

Alex Q,
Я вам говорил о модуле Страницы / редактор страниц. Для модуля фотоальбомы это делать не нужно так как там на системном уровне работают все эти увеличения по клику.
Yuri_Geruk,

ммммм... та я ж об этом, в Модулях редактируются только коды 4-х указанных страниц, которые находятся в блоке "Страницы", в редактор кода этих страниц так же можно зайти с визуального редактора, остальные находятся в блоке Модули и содержат полный код шаблона сайта, который мы отредактировали в ПРОМО, но там почему то остался в изначальном варианте, ок, фотоальбом будем кликать, но а  страница форума как бы тоже имеет свой установленный код, который не редактируется, так?

вопрос 2

а в тех страницах, которые всё таки подлежат редактированию, где стоит код:

<a class="ulightbox" data-fancybox-group="ultbx" title="1744" href="https://kirashop.ucoz.net/1744_n.jpg">
<img height="180" src="https://kirashop.ucoz.net/1744_n.jpg" width="140" /></a>
<a class="ulightbox" data-fancybox-group="ultbx" title="2256" href="https://kirashop.ucoz.net/2256_n.jpg">
<img height="180" src="https://kirashop.ucoz.net/2256_n.jpg" width="140" /></a>
<a class="ulightbox" data-fancybox-group="ultbx" title="2816" href="https://kirashop.ucoz.net/2816_n.jpg">
<img height="180" src="https://kirashop.ucoz.net/2816_n.jpg" width="140" /></a>
<a class="ulightbox" data-fancybox-group="ultbx" title="3264" href="https://kirashop.ucoz.net/3264_n.jpg">
<img height="180" src="https://kirashop.ucoz.net/3264_n.jpg" width="140" /></a>
<a class="ulightbox" data-fancybox-group="ultbx" title="4192" href="https://kirashop.ucoz.net/4192_n.jpg">
<img height="180" src="https://kirashop.ucoz.net/4192_n.jpg" width="140" /></a>
<a class="ulightbox" data-fancybox-group="ultbx" title="4944" href="https://kirashop.ucoz.net/4944_n.jpg">
<img height="180" src="https://kirashop.ucoz.net/4944_n.jpg" width="140" /></a>
<a class="ulightbox" data-fancybox-group="ultbx" title="8736" href="https://kirashop.ucoz.net/8736_n.jpg">
<img height="180" src="https://kirashop.ucoz.net/8736_n.jpg" width="140" /></a>

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

Alex Q,

Чтобы фото не уходили на вторую строку, отредактируйте страницу с этими фото, найдите и удалите такой код:

<div class="add-link-wrapper"></div>

после проблема решится.

Alex Q,

На вашем месте я бы удалил модули:

  1. https://kirashop.ucoz.net/publ
  2. https://kirashop.ucoz.net/blog/
  3. https://kirashop.ucoz.net/load/

вам достаточно одного модуля новости https://kirashop.ucoz.net/news/ и модуля страницы, все остальное лишнее и лишь вы путаетесь в таком количестве модулей.

Alex Q,

Пример скрипта и для форума и для модуля новости, в глобальный блок нижняя часть сайта в самый низ вставить:

<script type="text/javascript">
$(".eMessage img, .ucoz-forum-post img ").each(function() {
$(this).wrap("<a href='" + this.src + "'/>");
$('a[href$=".jpg"], a[href$=".jpeg"], a[href$=".gif"], a[href$=".png"]').addClass('ulightbox').attr("data-fancybox-group", "ultbx");
});
 </script>

в итоге фото будут автоматически увеличиваться (и листаться стрелочкой при условии если на странице больше 1-го фото).

Yuri_Geruk,

...поправил, удалил было лишнний </div>, но всё равно теперь фотки тискаются по ширине, чтобы втиснуться в ширину поля, а надо, чтобы переходили на вторую строку

Yuri_Geruk,

походу получилось )

надо было добавить  <meta charset="utf-8"> - понял после того, как всё перепробовал )

нашёл на http://htmlbook.ru/ 

Yuri_Geruk,
...но теперь пытаюсь понять как уменьшить расстояние между фотками
Yuri_Geruk,
скрипт добавил, но в форуме по прежнему нет поля для редактирования кода
Yuri_Geruk,
наоборот, мне нужно, чтобы фото не заходили за пределы поля, уходя из зоны видимости, а переходили на вторую строку, но понимая какая фотка уже лишняя в строке, чтобы с неё и начиналась вторая (третья, т.п.) строка  в этих модулях в перспективе планируется представлять разные группы товаров и, как знать, может в каком то обозримом будущем понадобятся и статьи, и блог, и форум...   спасибо за скрипт, буду пробовать...
Yuri_Geruk,

...нашёл <div class="add-link-wrapper"></div>, удалил, получилась полная ХХХто знает что

Alex Q,
  1. Как вижу все исправили. Дополнительный <meta charset="utf-8"> который вы добавили, удалите, он лишний так как в шаблоне в самом начале он уже есть, второй не нужен.
  2. На форуме та форма что есть при добавлении и редактировании сообщений, это все что есть, не более.
  3. Вы для фото прописали стили:

.thumb img { border: 2px solid #55c5e9; padding: 2px; background: #666; margin-right: 2px; margin-bottom: 2px; }

это текущее расстояние, оно и так минимальное, думаю еще меньше делать не стоит.

Yuri_Geruk,

но пока не вставил <meta charset="utf-8"> в код - фотки располагались в ряд и уходили с поля зрения...

просто единственное, что там нашёл но там код всей страницы целиком

http://htmlbook.ru/faq/kak-razmestit-neskolko-kartinok-ryadom-po-gorizontali

...который подогнал под свой вариант и вроде получилось

а можно каким то образом изменить цвет фона поля с белого на какой ни-ть другой?

Alex Q,
  1. Перейти в панель управления - Дизайн - Редактор - CSS, удалить все содержимое, после вместо удаленного содержимого установить содержимое с файла https://kirashop.ucoz.net/.s/src/css/1718.css - Сохранить.
  2. После найти строку номер 45:

#content{-webkit-box-flex:5; -ms-flex:5 1 10px; flex:5 1 10px; background-color:#fff; padding:30px 25px; max-width:72%}

вместо выделенного красным прописать нужный фон. Подобрать цвет фона можно на сайте https://www.color-hex.com/ после как пропишите и сохраните изменения, очистите кеш в браузере https://ukit.com/ru/help/kak-ochistit-cahe

Yuri_Geruk,
ох... спасибо, как то боязно становится от фразы "всё удалить" :*  ну буду пробовать, ещё раз спасибо!  ещё вопрос, пока не забыл - язык сайта выбран английский, но разделы: Календарь, в частности месяц и дни недели, Entries archive, Statistics (содержание) отображается на русском, с этим можно как-то бороться?
Alex Q,
часть можно сменить с помощью замены стандартных записей. https://kirashop.ucoz.net/admin- инструменты - замена стандартных надписей. остальное через правку шаблонов
Alex Q,

Дни недели и месяци можете заменить на английский здесь https://kirashop.ucoz.net/panel/tools/signs/111 Остальное так же там можно изменить, главное выбрать правильный раздел и искать что нужно. Не забывайте после всех изменений нажать на кнопку Сохранить.

webanet,
ок, спасибо!
Yuri_Geruk,
спасибо!  и цвет поменял - вроде получилось, но теперь как-то не прикольно выглядит рядом всё равно блок с белым фоном... наверно надо искать где то в кодах первого контейнера, чтобы поставить тот же цвет...
Yuri_Geruk,

по поводу форума - Вы имели в виду этот раздел?

Alex Q,

1. Чтобы и правый контейнер был с таким же фоном, в стилях в строке 46 найти:

aside{-webkit-box-flex:2; -ms-flex:2 1 10px; flex:2 1 10px; background-color:#f0f0f0; padding:30px 0; border-left:1px solid #d6d6d6; max-width:315px}

вместо выделенного красным прописать #F3F9F8

2. По поводу форума имел ввиду http://joxi.ru/52ag1aOcbqXoxr

Yuri_Geruk,

1. ок, спасибо!

2. ммммммммм... так в смысле если этот скрипт вставлен в Редактор/Глобальные блоки/Нижняя часть сайта, то теперь в форум можно будет вставлять картинки и они будут "...автоматически увеличиваться (и листаться стрелочкой при условии если на странице больше 1-го фото)?"

3. в этом всплывающем окошке существует определённый лимит символов, которые там могут отразиться или этот лимит где то можно поменять?

<a class="ulightbox" data-fancybox-group="ultbx" title="4192" href="https://kirashop.ucoz.net/4192_n.jpg">

Alex Q,
  1. Да, будут автоматически увеличиваться. Листаться при условии если на странице больше 1-го фото, скрипт будет выполнять эту работу.  
  2. title="4192" это не лимит, можете его удалить вообще.
Yuri_Geruk,

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

2. <a class="ulightbox" data-fancybox-group="ultbx" title="4192" href="https://kirashop.ucoz.net/4192_n.jpg">
<img height="180" src="https://kirashop.ucoz.net/4192_n.jpg" width="146" /></a>

это код, который позволяет при наведении курсора на картинку получить краткое описание во всплывающем окошке, так вот вопрос в том можно ли как то увеличить лимит символов для отражения в этом окошке для понимания пределов этого описания

Alex Q,
Там лимита нет, 4192 это просто текст титла названия картинки.
Yuri_Geruk,
да, но название картинки 4192 то я уже сам втулил, потом вместо этого названия втулил текст побольше с описанием, но оказалось, что текст целиком не помещается...
Alex Q,
В титле не должно быть сочинений, делать нужно максимально кратко.
Yuri_Geruk,

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

Yuri_Geruk,
1. с титлом вопрос решился  2. остался вопрос с разнообразием размеров фото...
Alex Q,
Завтра посмотрю. Ожидайте!
Alex Q,
На какой странице можно увидеть эту проблему с отображением фото? Ссылку утчоните.
Yuri_Geruk,

Доброе утро!

вот на этой - главной странице https://kirashop.ucoz.net/

код типа:

<meta charset="utf-8">
<style>
 .thumb img {
 border: 2px solid #55c5e9;
 padding: 2px;
 background: #666;
 margin-right: 2px;
 margin-bottom: 2px;
 }
 </style>
<body> 
<p class="thumb">
<a class="ulightbox" data-fancybox-group="ultbx" title="2272" href="https://kirashop.ucoz.net/2272_n.jpg">
<img height="22%" src="https://kirashop.ucoz.net/2272_n.jpg" width="22%" /></a>.......................................

размеры указаны в %, только так можно было получить реальные пропорции, но походу фотки в этом виде никак не выровнять априори, потому как они взяти с разных источников и имеют разные размеры, разве что можно каким-то обраом разместить их рендомно на странице и втулить промеж них какой то текст, просто прикол в том, что текст должен обтекать картинку со всех сторон и размещаться картинки должны именно в случайном порядке, с теми же функциями, которые вписаны в скрипте...

есть ещё один прикол:

этот код скопирован со второй страницы:

https://kirashop.ucoz.net/index/site_info/0-2

код:

<meta charset="utf-8">
<style>
   .thumb img  {
    border: 2px solid #55c5e9;
    padding: 2px;
    background: #666;
    margin-right: 2px;
    margin-bottom: 2px;
   }
  </style>
<body>  
<p class="thumb">
<a class="ulightbox" data-fancybox-group="ultbx" title="1744" href="https://kirashop.ucoz.net/1744_n.jpg">
<img height="180" src="https://kirashop.ucoz.net/1744_n.jpg" width="146" /></a>.........................................

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

может с этим можно как то бороться или есть какая то зависимость от количества картинок на странице??

Alex Q,
  1. Да, высота фото разная, в этом проблема. Здесь нужны сторонние плагины (скрипты) чтобы фото заполняли пустое пространство. Но здесь больше возни так как идеально найти такой скрипт какой нужен очень сложно и после все это применить конкретно для своих фото.
  2. Не увидел проблемы на странице https://kirashop.ucoz.net/index/site_info/0-2 увеличивается отлично и до нормальных размеров на сколько это возможно по высоте экрана и размеру картинки.
Yuri_Geruk,

да, на этой https://kirashop.ucoz.net/index/site_info/0-2 нормально, но там размеры фото в пикселях, подбирались вручную

вопрос был по этой - главной, где размеры фото в % https://kirashop.ucoz.net/ - там фото увеличивается совсем незначительно, но там больше фоток на странице, может проблема в этом?

а разместить фото в тех размерах, какие есть и задать на странице обтекание текстом со всех  это тоже сложно или как то возможно?

Alex Q,
Незначительно так как оригинал фото небольшой, некуда больше увеличивать.
Alex Q,
Завтра посмотрю.
Yuri_Geruk,
понял, спасибо!
Alex Q,
Посмотрел, по сути лучше не сделать чем есть сейчас так как размеры оригинала и открытого фото при клике одинаковые, некуда еще больше его увеличивать чем оно есть в оригинале.
Yuri_Geruk,
ок, понял, а по поводу второго вопроса - можно ли разместить фото на странице среди текста в случайном порядке, в то же время используя данный код и скрипт?
Alex Q,
Да, можно. Размещайте как удобно. Скрипт свою работу будет выполнять.
Yuri_Geruk,

спасибо!

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

<style> .leftimg { float:left;

margin: 7px 7px 7px 0;

} .rightimg { float: right;

margin: 7px 0 7px 7px;

</style> </head> <body> <h2>Тайтл</h2> <p><img src="images/1.jpg" alt="Фото" width="132" height="174" class="leftimg"> Текст </p>

не могу найти тот, который задаёт случайный порядок картинок, можно ли задать обтекание текстом не для каждой конкретной фотки, а для всеё страницы, независимо от количества фоток на ней?

Alex Q,

В данном коде случайный порядок задают стили:

.leftimg { float:left;margin: 7px 7px 7px 0;} 
.rightimg { float: right;margin: 7px 0 7px 7px;}

первая строка выравнивает фото по левому краю, вторая по правому.

Обтекание можете задавать отдельно для тех фото гре применяете класс class="leftimg" сами по себе фото не будут иметь обтекание пока вы не примените этот класс.

Yuri_Geruk,

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

страница всё та же:

https://kirashop.ucoz.net/

Alex Q,

Увы, для всех фото на странице автоматически никак не сделать, нужно все настраивать по отдельности. И да, вы в стили не прописали:

.leftimg { float:left;margin: 7px 7px 7px 0;} 
.rightimg { float: right;margin: 7px 0 7px 7px;}

это решит часть проблем с отображением.

Yuri_Geruk,
оу... такида, не прописал, сорри, счас попробую
Yuri_Geruk,

не решило...

этот код был прописан, единыжды в начале

<style>
<p class="thumb">
.leftimg { float:left; margin: 3px 3px 3px 0;}
.rightimg { float: right; margin: 3px 0 3px 3px;}
</style>
<p>
<a class="ulightbox" data-fancybox-group="ultbx" title="2272" href="https://kirashop.ucoz.net/2272_n.jpg">
<img height="22%" src="https://kirashop.ucoz.net/2272_n.jpg" width="22%" /class="leftimg"></a>
<a class="ulightbox" data-fancybox-group="ultbx" title="72160" href="https://kirashop.ucoz.net/72160_n.jpg">
<img height="22%" src="https://kirashop.ucoz.net/72160_n.jpg" width="22%" /class="leftimg"></a>

This style was popularized in the mid of 1960’s. Hippies started to involve boho details, bright prints, and colors in their outfits. Hippies were opened to any culture, religion, and nationality. Their open-minded views promoted various countries national clothes. By the way, ethnic from Latin word means people.</p>

но не могу добиться расположения текста по всему пространству между фото - получаются пустые места рядом с фото...

Alex Q,

Я говорил в стили прописать, вы не прописали как я говорил. Прописать именно те 2 строки:

.leftimg { float:left;margin: 7px 7px 7px 0;} 
.rightimg { float: right;margin: 7px 0 7px 7px;}

нужно сюда https://kirashop.ucoz.net/panel/design/common/css в самый низ новой строкой. И да, как я говорил, это не решит полностью вашу проблему, решит частично лишь там где вы применили классы:

class="leftimg"
class="rightimg"

Alex Q,

И еще, в стилях не должно быть кода:

<style>
<p class="thumb">
.leftimg { float:left; margin: 3px 3px 3px 0;}
.rightimg { float: right; margin: 3px 0 3px 3px;}
</style>

выделил красным, это удалить если вы стили размещаете напрямую на странице.

Yuri_Geruk,

оххх... сорри, я ж думал, что стили имеется в виду <style>...</style> а не css

счас буду пробовать, спасибо!

Yuri_Geruk,
О!  как удалил - уже помогло, спасибо!  ...и если это прописать в css то я так понимаю уже не нужно будет его прописывать в каждую страницу, так?
Yuri_Geruk,

практически получилось, спасибо!

https://kirashop.ucoz.net/

Alex Q,
Да, если в css прописать, не нужно будет на каждой странице писать.
Alex Q,
Текущее обращении закрыто!
...