Подключение less

[LordBelial 0]

Для удобства работы в больших шаблонах, которые делаю с нуля, я использую less ( http://lesscss.ru ) с копмилятором less.php, который преобразует в css.

Как применить в движке VamShop2 less так что бы в редакторе админки можно было работать по правилам less, а уже у шаблона сайта был css формат?

Стили, которые используются к данному шаблону, включая bootstrap мне не нужны, т.к. сам с нуля делаю вёрстку.

[support 447]

Даже и не знаю, не пробовал его.

 

Если речь про подключение js файлов, то их можно подключить в /app/View/Layouts/admin.ctp , что б они по всей админке были, либо в /app/View/Stylesheetcs/admin_edit.ctp , что б, к примеру, были на странице редактирования стиля.

 

Сами файлы положить в /app/webroot/js

 

Но я не пробовал, в админке, при редактировании стиля грузится js файл подсветки кода, нужно проверять, не будет ли он мешать less.

 

Если б была php версия less, то можно было было его добавить в /app/Controller/StylesheetController.php , там по умолчанию добавлен код сжатия css стилей, к нему можно было бы добавить и замену переменных.

[LordBelial 0]

Понял. Спасибо :)

За что отвечает скрипт /js/vamshop.js ?

[support 447]

Это всякие js примочки для каталога: выстраивание колонок с товаром по высоте, прокрутка страницы наверх, всплывающая корзина, плавная подсветка, bootstrap подсказки.

 

Сам файл в /app/webroot/js/vamshop.js

[LordBelial 0]

Немного не понял с подключение компилятора lessphp

Вот код, который мне надо подключить:

 

// Connection php compiler less "lessphp".
require ('адрес где будет лежать php компилятор/lessphp/lessc.inc.php');
$less = new lessc;
$less->compileFile('адрес где будет лежать стиль less/less/layout.less', 'адрес где будет выгружаться уже скомпилированный css/css/style.css'); 

[support 447]

Попробуйте положить lessphp папку в /app/Vendor

 

Затем в /app/StylesheetController.php можно попробовать поменять:

echo '/* Begin Stylesheet: ' . $stylesheet['Stylesheet']['name'] . ' */'."\n"; 
echo $output;
echo "\n".'/* End Stylesheet: ' . $stylesheet['Stylesheet']['name'] . ' */'."\n"; 
die();

на что-то типа:

App::import('Vendor', 'lessphp', array('file' => 'lessphp'.DS.'lessc.inc.php'));
$less = new lessc();
 
echo '/* Begin Stylesheet: ' . $stylesheet['Stylesheet']['name'] . ' */'."\n"; 
echo $less->compile($stylesheet['Stylesheet']['stylesheet']);
echo "\n".'/* End Stylesheet: ' . $stylesheet['Stylesheet']['name'] . ' */'."\n"; 
die();

 

Примерно так это делается. Если знаете основы php, то, по идее, ничего сложного.

 

т.е. мы берём стиль из базы, он у нас в переменной $stylesheet['Stylesheet']['stylesheet'] и пропускаем через less

 

Хотя конечно лучше не на лету делать это, а сохранять в файл пропущенный через less css стиль и затем уже выводить его.

 

P.S. Кстати, если Вы правите шаблоны, стили в админке, не забывайте связывать между собой шаблон со стилем, т.е. в Админке - Оформление - Шаблон есть кнопка Привязать стиль, не забывайте привязывать css стили к своему шаблону, потому как по умолчанию шаблоны и стили ведь не связаны.

[LordBelial 0]

Как я понял такая конструкция будет срабатывать каждый раз, когда обращаешься к сайту?

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

[LordBelial 0]

При использовании этого метода  http://vamshop.ru/forum/topic/12584-как-отключить-объединениесжатие-css-js-файлов/ стили работающие через базу  данных отключаются?

[support 447]

Да.

 

Ну Вы ж можете задать условие, что не использовать less если debug к примеру выключен в /app/Config/core.php

 

В общем, вариантов много настроить.

 

Если debug включён - на лету компилировать, если выключен - читать готовый файл.

 

Вот условие что б узнать, включён debug или нет:

if (Configure::read('debug') > 0) {
выводим на лету
} else {
читаем готовый сгенерированный файл
}

[support 447]

Нет, не отключаются.

 

Если Вам надо отключить стили из базы (Админка - Оформление - Стили), то просто из шаблона уберите метку:

{stylesheet}

Это она тянет стили из базы (т.е. эта метка берёт код из /app/Controller/StylesheetController.php , из метода load).

 

Сам исходный код этой метки в /app/Vendor/smarty/vam_plugins/function.stylesheet.php.

 

Можно просто подключать файл, а не брать из базы, т.е. вместо {stylesheet} вставьте код подклечения файла:

<link rel="stylesheet" type="text/css" href="{base_path}/css/vamshop.css" />

Стили из базы сделаны из расчёта, что пользователю после установки вообще не понадобится ftp клиент и подключение к сайту по ftp, т.е. всё через админку.

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

 

Если грузить стили из файла, то конечно, что б что-то исправить в стилях, нужно брать файл из /app/webroot/css/vamshop.css и править его, для этого конечно ftp клиент нужен или файл-менеджер в панели хостинга.

[support 447]

Сжатие css/js лучше не отключать, с ним сейчас, по идее, проблем быть не должно.

 

Если Вы какой-то js, css файл исправите, добавите что-то новое, скрипт сам по-новой сгенерирует новые объединённые/сжатые css, js файлы.

[LordBelial 0]

 

Сжатие css/js лучше не отключать, с ним сейчас, по идее, проблем быть не должно.

Если Вы какой-то js, css файл исправите, добавите что-то новое, скрипт сам по-новой сгенерирует новые объединённые/сжатые css, js файлы.

не понял

 

 

Опытным путем выяснил, что при замене указанном http://vamshop.ru/forum/topic/12584-как-отключить-объединениесжатие-css-js-файлов/  {stylesheet} не генерируется. 

Я предположил, что в конце не дописана строчка 

<script type="text/javascript" src="{base_path}/js/vamshop-packed.js"></script>

Но то же не получил ни какого результата.

============================================

 

С использованием метода "отключения объединение/сжатие" получаем на выходе 

<link href="/css/vamshop-packed.css" rel="stylesheet" type="text/css">

А при использовании метода описанного в посте "отключения/сжатия" получает только те строки, которые указаны в тексте

<link rel="stylesheet" type="text/css" href="{base_path}/css/bootstrap/bootstrap.css" />
<link rel="stylesheet" type="text/css" href="{base_path}/css/font-awesome.min.css" />
<link rel="stylesheet" type="text/css" href="{base_path}/css/lightbox/jquery.lightbox.css" />
<link rel="stylesheet" type="text/css" href="{base_path}/css/sequencejs.css" />

[support 447]

Стили в Админке - Оформление - Стили работают отдельно, они не участвуют в общем сжатии css,js и выводятся меткой {stylesheet}

Вы ж сами посмотрите, эта метка отдельно стоит.

 

Смотря что Вы хотите, если не хотите брать стили из базы, есть файл /app/webroot/css/vamshop.css

Он идентичен стилям в базе данных (в Админке - Оформление - Стили).

 

Можете его подключать, т.е. вместо {styleshee} метки вставяйте <link rel="stylesheet" type="text/css" href="{base_path}/css/vamshop.css" />

[LordBelial 0]

После изменений, которые описаны в "объединение/сжатие", что должна выдавать метка {styleshee}  ?

[support 447]

Она не зависит от объединения/сжатия.

Эта метка выводит ссылку на стиль, вот например - http://demo.vamshop.com/stylesheets/load/vamshop.css

 

т.е. ссылку на стиль, который прицеплен к текущему шаблону страницы.

[LordBelial 0]

Сейчас подключил к шаблону новый стиль и она выдала 

<link type="text/css" href="/stylesheets/load/lyapko-less.css" rel="stylesheet">

до этого после изменений "объединение/сжатие" она не появлялась.

----------------------------------------------

[LordBelial 0]

Кажется понял.

[LordBelial 0]

И все же с .less мне удобнее работать через фаил, а не через встроенный редактор и базу на сайте.

Как правильно подключить?

// Connection php compiler less "lessphp".
require ('путь к компилятору/lessphp/lessc.inc.php');
$less = new lessc;
$less->compileFile('путь к less файлам /less/layout.less', 'путь к сформированному (скомпилированному) css файлу/css/style.css'); 

[support 447]

А где взять .less css файл для примера, попробую хоть, что это такое.

[LordBelial 0]

Правила less на русском описаны тут http://lesscss.ru php компилятор тут и описание на анг.яз тут http://leafo.net/lessphp/

[support 447]

Вообще, судя по краткому описаию сверху на http://lesscss.ru/

 

Должно быть достаточно подключить styles.less и less.js

 

т.е. вместо {stylesheet} добавляйте:

<link rel="stylesheet/less" type="text/css" href="{base_path}/less/styles.less">
<script src="{base_path}/less/less.js" type="text/javascript"></script>

Соответственно, в /app/webroot/ должна быть папка less с файлами styles.less и less.js

 

Пробовали так?

[LordBelial 0]

я не сторонник less.js 

мне больше нравиться lessphp (вторая ссылка) 

поэтому и спрашиваю про него.

[support 447]

Понятно, попробую сейчас.

[support 447]

Вроде всё просто.

 

Вот сделал модуль LESS для VamShop 2 - http://vamshop.ru/forum/topic/12752-%D0%BF%D0%BE%D0%B4%D0%BA%D0%BB%D1%8E%D1%87%D0%B0%D0%B5%D0%BC-less-%D0%B2-vamshop-2/

 

Попробуйте.

 

Спрашивайте, если что-то не понятно по установке.

[LordBelial 0]

Все работает как надо!

Огромное спасибо!!

К описанию можно добавить что-то вроде:

Когда дизайн будет готов, less можно отключить оставить строчку {less output="style.css"} , что бы не загружать сервер дополнительных php кодом.