Использование редактора презентаций

Администратор Development

Шаблоны презентаций

Упрощенный синтаксис, более мощный функционал

В блоке во вкладке Params нужно указать twig=1 и disabledCkEditor=1

Таким образом блок станет поддерживать twig

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

Пример тема Chersonese - является наследуемой темой от темы TM58887, включение плагина Twig - не рекомендуется

Презентация “С логотипом” (with_logo)

<div class="page">
    {{ _view.element('Dompdf.pdf/logo', {'offer': offer}) }}
    <div class="container">
        <div class="row">
            <div class="left-col">
                {{ _view.element('Dompdf.pdf/title', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/address', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/price', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/params_block', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/advertisement', {'offer': offer}) }}
                {% if offer.Youtube %}
                    {{ _view.element('Youtube.pdf/youtube_advertisement', {'offer': offer}) }}
                {% endif %}
                {{ _view.element('Dompdf.pdf/map', {'offer': offer}) }}
            </div>
            <div class="right-col">
                {{ _view.element('Dompdf.pdf/picture', {'pictures': offer.AdvertisementPicture, 'maxLimit': '10'}) }}
            </div>
            <div class="clear"></div>
        </div>
        <div class="row">
            {{ _view.element('Dompdf.pdf/tenants', {'offer': offer}) }}
        </div>
    </div>
</div>

Презентация “(New) С логотипом” (with_logo_new)

<div class="page">
    {{ _view.element('Dompdf.pdf/logo', {'offer': offer}) }}
    <div class="container">
        <div class="row">
            <div class="left-col">
                {{ _view.element('Dompdf.pdf/title', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/address', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/price', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/params_block', {'offer': offer}) }}
                {% if offer.Youtube %}
                    {{ _view.element('Youtube.pdf/youtube_advertisement', {'offer': offer}) }}
                {% endif %}
                {{ _view.element('Dompdf.pdf/map', {'offer': offer}) }}
            </div>
            <div class="right-col">
                {{ _view.element('Dompdf.pdf/picture', {'pictures': offer.AdvertisementPicture, 'maxLimit': '10'}) }}
            </div>
            <div class="clear"></div>
        </div>
        <div class="row">
            {{ _view.element('Dompdf.pdf/advertisement', {'offer': offer, 'title': 'Описание'|__, 'defaultTextLimit': 1250}) }}
        </div>
    </div>
</div>

Презентация “Без логотипа” (without_logo)

<div class="page">
    <div class="container">
        <div class="row">
            <div class="left-col">
                {{ _view.element('Dompdf.pdf/title', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/address', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/price', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/params_block', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/advertisement', {'offer': offer}) }}
                {% if offer.Youtube %}
                    {{ _view.element('Youtube.pdf/youtube_advertisement', {'offer': offer}) }}
                {% endif %}
                {{ _view.element('Dompdf.pdf/map', {'offer': offer}) }}
            </div>
            <div class="right-col">
                <div class="row">
                    {{ _view.element('Dompdf.pdf/picture', {'pictures': offer.AdvertisementPicture, 'maxLimit': '10'}) }}
                </div>
            </div>
        </div>
    </div>
    <div class="clear"></div>
</div>

Презентация “Не для рекламы” (not_for_advertising)

<div class="page">
    <div class="container">
        <div class="row">
            <div class="left-col">
                {{ _view.element('Dompdf.pdf/title', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/address', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/price', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/params_block', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/advertisement', {'offer': offer}) }}
                {% if offer.Youtube %}
                    {{ _view.element('Youtube.pdf/youtube_advertisement', {'offer': offer}) }}
                {% endif %}
                {{ _view.element('Dompdf.pdf/map', {'offer': offer}) }}
            </div>
            <div class="right-col">
                <div class="row">
                    {{ _view.element('Dompdf.pdf/picture', {'pictures': offer.AdvertisementPicture, 'maxLimit': '10'}) }}
                </div>
            </div>
        </div>
    </div>
    <div class="clear"></div>
</div>

Презентация “Подробная” (detailed)

<style>
    .left-col {
        width: 45%;
        float: left;
    }
    .right-col {
        float: right;
    }
</style>
<div class="page">
    <div class="container">
        <div class="row">
            <div class="left-col">
                {{ _view.element('Dompdf.pdf/detailed/logo', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/detailed/title', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/address', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/detailed/price', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/params_block', {'offer': offer, 'title':'Параметры', 'filter': 'pdf'}) }}
            </div>
            <div class="right-col">
                <div class="row">
                    {{ _view.element('Dompdf.pdf/detailed/main_picture', {'pictures': offer.AdvertisementPicture}) }}
                    {{ _view.element('Dompdf.pdf/detailed/map', {'offer': offer, 'title': 'Карта'|__}) }}
                    {{ _view.element('Dompdf.pdf/detailed/contact', {'offer': offer, 'first': true}) }}
                    {{ _view.element('Dompdf.pdf/detailed/about', {'offer': offer}) }}
                </div>
            </div>
            <div class="clear"></div>
            <div class="full_panels">
                {{ _view.element('Dompdf.pdf/advertisement', {'offer': offer, 'title': 'Описание'|__, 'defaultTextLimit': 1250}) }}
            </div>
        </div>
    </div>
</div>
{{ _view.element('Dompdf.pdf/detailed/picture', {'offer' => offer})}}

Презентация “Краткая” (short)

<style>
    .short-block {position: relative}
    .pdf-short-top {margin-bottom: 20px}
    .pdf-short-top-site-name-wrapper {width: 420px;height: 0;float: left;border-bottom: 100px solid #67067b;border-right: 100px solid transparent;font-weight: bold;}
    .pdf-short-top-site-name {padding: 15px 0 0 15px;color: #ff6a79;font-size: 14px;text-transform: uppercase;}
    .pdf-short-top-adress-wrapper {padding: 5px 0 0 15px;color: white;font-size: 12px;}
    .pdf-short-top-object {padding: 5px 0 0 15px;color: white;}
    .pdf-short-top-logo {float: right;}
    .pdf-short-top-logo img {margin: 10px 0;}
    .short-title-wrapper {}
    .short-title {float: left;color: #67067b;font-size: 16px;padding: 15px 0;height: 50px;font-weight: bold;}
    .short-price {float: right;}
    .short-line-after-price {border-top: 25px solid transparent;border-right: 30px solid #e56766;border-bottom: 25px solid transparent;float: left;}
    .short-price-content {background-color: #e56766;color: white;font-size: 18px;padding: 11px 0;margin-left: 30px;}
    .short-pictures.photos {margin-bottom: 20px}
    .short-pictures.photos .main-photo-small {padding: 10px 35px 10px 25px;background-color: #ebebeb;text-align: center;}
    .short-pictures.photos .main-photo-small a {display: block;}
    .short-criteria {text-align: justify;margin-bottom: 20px}
    .short-criteria-locations {display: inline-block; width: 220px; vertical-align: top;}
    .short-criteria-locations--title {width: 255px; color:#67067b; font-size: 16px; font-weight: bold;}
    .pdf-short-locations {margin-left: 20px}
    .short-criteria-params {display: inline-block; width: 220px; margin-left: 40px; vertical-align: top;}
    .short-criteria-params--title {width: 255px; color:#67067b; font-size: 16px; font-weight: bold;}
    .pdf-short-params {margin-left: 20px}
    .short-criteria-area {display: inline-block; width: 220px; margin-left: 40px; vertical-align: top;}
    .short-criteria-area--title {width: 255px; color:#67067b; font-size: 16px; font-weight: bold;}
    .pdf-area-list {margin-left: 20px}
    .short-description {}
    .short-description-p {color: #67067b;font-size: 16px;font-weight: bold;}
    .rieltor-div {position: absolute;bottom: 0;}
    .background-rieltor {margin-right: 60px;}
    .background-rieltor--angle {width: 220px;float: right;height: 150px;background-color: #67067b;transform: skewX(45deg);}
    .background-rieltor--wrapper {margin-top: 25px;width: 620px;height: 0;border-bottom: 100px solid #ebebeb;border-right: 100px solid transparent;font-weight: bold;float: left}
    .pdf-short-rieltor-picture {float: left; height: 80px; width: 70px; padding: 10px 30px 10px 20px;}
    .pdf-short-rieltor-picture img {height: 80px; max-width: 70px}
    .pdf-short-rieltor-info {margin-left: 100px;}
    .pdf-short-rieltor-info-t {color:#67067b; font-size: 16px; font-weight: bold;}
    .pdf-short-rieltor-info-name {color:#606060; font-size: 12px; font-weight: lighter;}
    .pdf-short-rieltor-info-phone {color:#606060; font-size: 12px; font-weight: lighter;}
    .pdf-short-rieltor-info-email {color:#606060; font-size: 12px; font-weight: lighter;}
    .pdf-short-rieltor-info-ext {color:#606060; font-size: 12px; font-weight: lighter;}
</style>
<div class="page short-block">
    {{ _view.element('Dompdf.pdf/short/top', {'offer': offer}) }}
    {{ _view.element('Dompdf.pdf/short/title', {'offer': offer}) }}
    {{ _view.element('Dompdf.pdf/short/pictures', {'offer': offer}) }}
    {{ _view.element('Dompdf.pdf/short/criteria', {'offer': offer}) }}
    {{ _view.element('Dompdf.pdf/short/text', {'offer': offer}) }}
    {% if offer.Youtube %}
        {{ _view.element('Youtube.pdf/youtube_advertisement', {'offer': offer}) }}
    {% endif %}
    {{ _view.element('Dompdf.pdf/short/realtor', {'offer': offer}) }}
</div>

Презентация “Краткая (Синяя)” (short_blue)

<style>
    .page-main {padding: 1.5em 1.5em 1.5em 2.5em;}
    /* Top block */
    .location-block {padding: 5px 0 0 15px;color: #111;}
    .location-title {font-size: 13px;}
    .location-name {font-size: 14px;font-weight: bold}
    .location-before-block {position: absolute;width: 380px;height: 0;border-bottom: 110px solid #43bdea;border-right: 140px solid transparent;}
    .location-after-block {position: absolute;width: 288px;height: 0;border-bottom: 12px solid #BABABA;font-weight: bold;margin-top: 110px;margin-left: 232px;transform: skewX(50deg);}
    /* Area */
    .area-list {font-size: 14px !important;font-weight: bold !important;}
    /* Params */
    .params-list {font-size: 14px !important;font-weight: lighter !important;color: black !important;font-weight: bold;}
    /* Realtor */
    .background-realtor {margin-right: 80px;}
    .realtor-before-block {width: 320px;float: right;height: 95px;background-color: #43bdea;transform: skewX(48deg);}
    .realtor-after-block {width: 520px;height: 0;border-bottom: 95px solid #BABABA;border-right: 100px solid transparent;font-weight: bold;float: left;}
    .realtor-photo {float: left;height: 80px;width: 70px;padding: 10px 30px 10px 20px;}
    .realtor-photo img {height: 80px;max-width: 70px;}
    .realtor-info {margin-left: 115px;margin-top: 10px;}
    .realtor-info p {color: #111;font-size: 11px;}
    .realtor-info .title {color: #111;text-indent: 0;font-size: 16px;font-weight: bold;}
    /* Price */
    .price-block {margin: 15px 0 0 0;display: block;height: 70px;}
    .price-before-block {position: absolute;width: 255px;height: 0;border-bottom: 45px solid #43bdea;border-right: 50px solid transparent;font-weight: bold;}
    .price-after-block {position: absolute;width: 176px;height: 0;border-bottom: 12px solid #BABABA;font-weight: bold;margin-top: 45px;margin-left: 129px;transform: skewX(50deg);}
    .price-block .price {padding: 5px 0 0 15px;color: #111;font-size: 14px;}
    /* Others */
    h4 {font-weight: bold !important;color: #111 !important;font-size: 18px !important;margin-bottom: 10px;}
    .logo {z-index: 10;margin-left: 580px;margin-top: 0;margin-bottom: 0;}
    .item ul {text-indent: 0;list-style-type: none !important;}
    .item p {text-indent: 0;font-size: 14px !important;font-weight: lighter !important;}
    .short-title {color: #000;font-size: 16px;width: 250px;font-weight: bold;margin-bottom: 15px;}
    .main-info {height: 950px;}
</style>
<div class="page-main">
    <div class="container">
        <div style="margin-bottom: 30px; height: 120px">
            {{ _view.element('Dompdf.pdf/short_blue/top', {'offer': offer}) }}
        </div>
        <div class="row main-info">
            <div class="left-col">
                {{ _view.element('Dompdf.pdf/short_blue/rentTitle', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/short_blue/area', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/short_blue/params', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/short_blue/price', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/short_blue/descriptions', {'offer': offer}) }}
            </div>
            <div class="right-col" style="margin-top: 5px;">
                <div class="row">
                    {{ _view.element('Dompdf.pdf/short_blue/main_picture', {'pictures': offer.AdvertisementPicture}) }}
                    {{ _view.element('Dompdf.pdf/short_blue/main_plan', {'pictures': offer.AdvertisementPicture}) }}
                    {{ _view.element('Dompdf.pdf/short_blue/map', {'offer': offer}) }}
                </div>
            </div>
        </div>
        <div class="clear" style="height: 22.5px"></div>
        <div class="short_blue-contractor">
            {{ _view.element('Dompdf.pdf/short_blue/realtor', {'offer': offer}) }}
        </div>
    </div>
</div>

Презентация “СityPro” (city_pro)

<style>
    body {font-family: "times-new-roman";font-size: 15.5px;width: 100%;}
    .item p {text-indent: 0;}
    .bottom-page{position: absolute;left: 0;bottom: 0;width: 100%;height: 400px;}
    .left-col {top: 0;margin-top: 0;padding-top: 0;}
    .item h4 {font-size: 23px !important;font-weight: normal;}
    .p {font-size: 15px !important;}
</style>
<div class="page">
    <div class="main-page">
        {{ _view.element('Dompdf.pdf/city_pro/logo', {'offer': offer}) }}
        <div class="clearbox"></div>
        <div class="container">
            <div class="row">
                <div class="left-col">
                    {{ _view.element('Dompdf.pdf/city_pro/top', {'offer': offer}) }}
                    {{ _view.element('Dompdf.pdf/city_pro/rent', {'offer': offer}) }}
                    {{ _view.element('Dompdf.pdf/city_pro/price', {'offer': offer}) }}
                    {{ _view.element('Dompdf.pdf/city_pro/costs', {'offer': offer}) }}
                    {{ _view.element('Dompdf.pdf/city_pro/tax', {'offer': offer}) }}
                    {{ _view.element('Dompdf.pdf/city_pro/description', {'offer': offer}) }}
                </div>
                <div class="right-col">
                    <div class="row">
                        {{ _view.element('Dompdf.pdf/city_pro/picture', {'pictures': offer.AdvertisementPicture}) }}
                        <div style="position: absolute;"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="clear"></div>
    <div class="bottom-page">
        <div class="row">
            <div class="left-col" style="margin-top: 0; ">
                {{ _view.element('Dompdf.pdf/city_pro/address', {'offer': offer}) }}
                {{ _view.element('Dompdf.pdf/city_pro/map', {'offer': offer}) }}
            </div>
            <div class="right-col">
                <div class="row">
                    <div style="position: absolute;"></div>
                    {{ _view.element('Dompdf.pdf/city_pro/bottom_right', {'offer': offer}) }}
                </div>
            </div>
        </div>
    </div>
</div>