Запознайте се с MIGX пакет назначаване и как да го инсталирате, вижте статията, в която демонтирани метод удобен контрол въртележка за първоначално зареждане.
Приложения допълнения: рамка Twitter Bootstrap 3, JQuery библиотеката, JQuery на fancybox плъгин, MIGX и pdoTools MODx Добавки (за страниране).
Създаване MIGX конфигурация Портфолио
Развитие MIGX конфигурация е възможно за портфейл, чрез следните действия:
- Отваряне на мениджър страница MODx революция "MIGX мениджмънт".
- Обръщаме се към раздела "MIGX" и nazhnom върху бутона "Add Item".
- В диалоговия прозорец "MIGX" в раздела "Настройки" въведе в името на полето (конфигурация име) стойността на портфейла.
- В "Formtabs" в раздела, създаване на таблица с надпис "Портфейл" и следните области:
- FIELDNAME - име, Надпис - Наименование на работа.
- FIELDNAME - образ, Надпис - Изображение, Input тип телевизия - изображение.
- FIELDNAME - описание, Надпис - Описание на длъжността.
- FIELDNAME - цена, надпис - Цена, Input тип телевизия - номер.
- В "Колони", в раздела определи заглавия на таблица, с помощта на които потребителят е в ресурса MODx ще даде своя принос в съответните полета:
- Header - името на работата, поле - името, колона ширина - 30.
- Header - Изображение, Невярно - образ, Renderer - this.renderImage.
- Header - Описание, Невярно - описание, колона ширина - 200.
- Header - Цена, Невярно - цена.
Създаване на допълнително поле базирана конфигурация MIGX
Ние ще създадем допълнително поле с име портфолио. Съдържанието на този TV-област, определени като migx. Тъй като структурата на това поле се посочва, създадено преди конфигурация. В изберете "Шаблон за портфейла" като шаблон.
MODx - TV-кутия от типа на входа и конфигурация MIGX портфейл
Добавяне на данни към TV-област портфейл
Отваряне на ресурса, който като "шаблон за портфейла" шаблон избрания елемент. След това преминете към "Допълнителни полета" и е изпълнен с TV-променлива портфолио с някои данни.
MODx MIGX - Показва портфейл изображение на съдържанието на дадена страница с помощта fancybox
изходни данни от областта на телевизионния MIGX
Изходни данни от TV-областта (MIGX) е осъществим с помощта на фрагмент getImageList. В този случай, изходни данни няма всички наведнъж, и 5 броя порции. За това ние използваме фрагмента от pdoPage pdoTools пакет.
В резултат на това, ние получаваме следния код:
Последна активност - е да се създаде шаблон (парче) tplPortfolioItem. въз основа на което ще се формира, като всеки елемент портфолио.
Съдържание парче tplPortfolioItem:
Т.е. изходни елементи на портфейла ще бъдат разпределени (в зависимост от паритета на елемента). Ако странен елемент, а след това в лявата изображението и от дясната страна на текста (заглавие, описание, и цената й). Ако елементът е дори напротив - снимката в дясно, и текста на ляво. Образуване на мрежите са направени с помощта на класа за първоначално зареждане рамка.
CSS стилове, за да бъдат добавени към оформлението на страницата да изглежда правилно на малки устройства (XS и SM):
Извършване на друго действие, а именно да се свърже fancybox страница (да показва изображения в стила на лайтбоксът инструмента, които са над останалата част от съдържанието на уеб страницата).
След това трябва да го разархивирайте и копирайте източника към директорията на сайта.
Свързване с fancybox страница се извършва от 2 файла:
Активиране fancybox Портфолио снимки направени с помощта на следния скрипт:
Портфолио с страниране на страницата ще изглежда така.
MODx MIGX - началото на страницата "Портфолио" MODx MIGX - Долна част на страницата "Портфолио" (страниране) MODx MIGX - Показване на изображения върху съдържанието на портфейла страница с помощта на fancybox
Свързани статии