Миниатюры для блога. Танцы с бубном

Предлагаю свое решение для вывода миниатюр для блога как в самом блоге, так и в магазине. Если что не так или у кого есть решение проще - отписывайтесь.

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

Пишем хелпер wa-apps/blog/lib/classes/blogimage.class.php


<?php
class blogimage
{
public static function getImgSrc($data)
{
preg_match_all("/(<img )(.+?)( \/)?(>)/u", $data, $images);
$host = $images[2][0];
if (preg_match("/(src=)('|\")(.+?)('|\")/u", $host, $matches) == 1)
$host = $matches[3];
return $host;
}
}



Запрос вывода в блоге {blogimage::getImgSrc($post.text)} выдает нам URL первого изображения вставленного в любую часть текста поста блога.

Для получения очищенного от изображений текста блога используем:

Для вывода тизера без картинок: {$post.text_before_cut|regex_replace:"/(<img.*?>)/":""}
Для вызова текста без тизера: {$post.text|replace:$post.text_before_cut:''}
Для вызова всего текста без картинок: {$post.text|regex_replace:"/(<img.*?>)/":""}

Вот как-то так у меня получилось.

10 ответов

  • 1
    Вадим Стеблинский 11 июля 2014 02:26 #
    Огромное спасибо!
  • 1

    Через плагин "Главная картинка" для блога можно загружать и выдавать миниатюры в любом месте с помощью хелпера:

    {if $wa->blog}

    {blogMainpicPluginViewHelper::getPostMainpicById($id)}

    {/if}


    Работает нормально. Единственное что, я не знаю, как обрезать миниатюры нужного размера. Может кто подскажет?


  • 1
    Виталий 3 июня 2015 07:49 #

    Подскажите как вставить в макет код?

    вставляю {blogimage::getImgSrc($post.text)} не работает

  • 1

    если у кого то не заработал этот пример. просто очистите Кеш в инсталяторе (в настройках)

  • 1
    Mike Wing 26 мая 2016 12:47 #

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

    Можно использовать "дополнительные параметры" в Мета.

    Например.

    blogimage=/wa-data/public/photos/24/00/24/24.200x0.jpg

    и вывести в шаблоне блога в stream_posts.html

    {if !empty($post.blogimage)}
    <div class="blog-image">
    	<a href="{$post.link}">
    		<img src="{$post.blogimage}" alt="{$post.title}" title="{$post.title}" />
    	</a>
    </div>
    {/if}
  • 0
    Димасик 15 июля 2014 13:41 #
    На энтузиастах проект и держится.
  • 0
    20 августа 2014 22:33 #
    Большое спасибо! Работает отлично
  • 0
    Igor Sa 22 августа 2014 11:34 #
    Что-то у меня не работает!
    Может я не понял как это использовать!?
    Я создал класс хелпера в папке - wa-apps/blog/lib/classes/ и вызов этой функции {blogimage::getImgSrc($post.text)} вставляю в шаблон вывода списка записей (фаил - stream_posts.html) <div class="text">
    {$post.text}
    {if $post.cutted}
    <a href="{$post.link}">{$post.cut_link_label|default:'[`Continue reading →`]'}</a>
    {/if}
    </div> вместо {$post.text} ставлю {blogimage::getImgSrc($post.text)}, но картинка не выводится и текст пропадает, остаются только заголовки и "Читать далее".
    Я наверно что-то не так делаю.

    Может есть плагин, чтобы при написании поста можно было выбрать миниатюру, как в Вардпрессе!?
  • 0
    Давид Гугучія 24 мая 2016 18:21 #

    Данный хук позволяет вывести первую фотографию из вашего блога, допустим на главной странице в любом месте (в анонсе)

    1) Создайте класс blogImage.class.php с кодом в папке wa-apps/blog/lib/classes/


    <?php
    class blogImage
    {
        public static function getImage($id)
        {
            $model = new blogPostModel();
            $records = $model->getById($id);
            preg_match_all('/<img src=\"(.*)\">/', $records['text'], $maches); 
            return $maches[0][0];
        }
    }

    2) Выведите данный хук в с цикле foreach в любом месте шаблона (например в файле home.html). Тег {$img} можно перемещать в любое место, что и требовалось.


    {$latest_posts = $wa->blog->posts(null, 4)}
                
                 <h4 class="section-header">[`Latest blog updates`]</h4>
                    <ul class="thumbs text-content">
    
            {foreach $latest_posts as $post}
                            {$img = blogImage::getImage($post.id)}
                            
                           
                       <div class="blog_post_home">
                            <a href="{$post.link}">{$img}</a>
                           
                            <h4><a href="{$post.link}"class="bold">{$post.title|strip_tags|truncate:200}</a></h4>
                           
                            <p class="small">{$post.text|strip_tags|truncate:200}</p>
                           
                            <span class="hint">{$post.datetime|wa_datetime:"humandate"}</span>
                    </div>        
    {/foreach}
    
                    </ul>

    3) Внесите правки в css файлы вашей темы по своих нуждах


    .thumbs.text-content a img{
            max-height: 200px;
            max-width: 200px;
                padding-top: 20px;
    }
    .blog_post_home{
        float: left;
        position: relative;
        width: 25%;
        margin: 25px 20px 20px;
        padding: 0px;
        border: 1px solid #337ab7;
        text-align: center;
        border-radius: 35px;
        height: 300px;
    }
    

    Благодарен Гуглу и вот этому ресурсу https://wa-magazin.ru/blog/vyvodim-pervuyu-fotogra...

  • -1
    neil Партнер-разработчик 29 августа 2018 18:43 #

    есть плагин с обрезкой https://www.webasyst.ru/store/...

Добавить ответ

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