Добавление картинки к блогу в Simpla

Блог без картинки - это прошлый век. Добавим же её! Нам нужно будет внести некоторые изменения как в сам шаблон, так и в админку. Поэтому при обновлении Simpla на новую версию скорее всего всё похерится. Селяви.

Сначала я думал воспользоваться нативным хранением картинок для товаров, но после решил отказаться от этой мысли. Во-первых, заглавная картинка для блога нам нужна всего одна и возможность хранить сразу несколько для одной страницы блога явно избыточна. Но хуже всего то, что в таблице s_images картинки привязаны к товару product_id. Я решил, что добавлять еще одно поле blog_id - это нарушать "нормальность" этой таблицы, и решил пойти другим, более "топорным", но простым путём - добавить в таблицу s_blog поле image, в котором и буду хранить путь к картинке.


Для начала пропишем в конфиге путь к папке, где будут храниться картинки (не забудем создать саму папку).

/*
 * Файл: [config/config.php]
 */
;Изображения блога
blog_images_dir = files/blog/;

Открываем любимый клиент mySQL (у меня HeidiSQL), подключаемся к нашей базе данных и вводим комманду, которая добавить в таблицу записей блогов новое поле для хранения адреса картинки:

ALTER TABLE `s_blog` ADD `image` VARCHAR(255) NOT NULL DEFAULT '' AFTER `url`;

Теперь нужно рассказать Симпле о том, что у нас изменения в структуре БД:

/*
 * Файл [api/Blog.php]
 */
public function get_post($id) 
{
  // ..
  // Добавили поле b.image
  $query = $this->db->placehold("SELECT b.id, b.url, b.name, b.image, b.annotation, 
                                 b.text, b.meta_title, b.meta_keywords, 
                                 b.meta_description, b.visible, b.date 
                                 FROM __blog b $where LIMIT 1");
  // ..
}
public function get_posts($filter = array()) 
{
  // ..
  // И тут тоже
  $query = $this->db->placehold("SELECT b.id, b.url, b.name, b.image, b.annotation, b.text,
                                 b.meta_title, b.meta_keywords, b.meta_description, 
                                 b.visible, b.date
                                 FROM __blog b WHERE 1 $post_id_filter $visible_filter $keyword_filter
                                 ORDER BY date DESC, id DESC $sql_limit");
  // ..
}

В том же файле добавим методы для удаления картинки из БД:

/*
 * Файл [api/Blog.php]
 */
public function delete_image($page_id)
{
  $query = $this->db->placehold("SELECT image FROM __blog WHERE id=?", intval($page_id));
  $this->db->query($query);
  $filename = $this->db->result('image');
  if(!empty($filename))
  {
    $query = $this->db->placehold("UPDATE __blog SET image=NULL WHERE id=?", $page_id);
    $this->db->query($query);
    $query = $this->db->placehold("SELECT count(*) as count FROM __blog WHERE image=? LIMIT 1", $filename);
    $this->db->query($query);
    $count = $this->db->result('count');
    if($count == 0)
    {
      @unlink($this->config->root_dir.$this->config->blog_images_dir.$filename);
    }
  }
}

Открываем шаблон страницы редактирования блога. Нам нужно добавить в него возможность прикрепить картинки к блогу. Находим блок "Правая колонка свойств товара" и вставляем в неё следующую разметку (которую кстати я слизал из файла [simpla/design/html/ppoducts.tpl], только немного переделал):

/*
 * Файл [simpla/design/html/post.tpl]
 */
<!-- Правая колонка свойств товара --><div id="column_right">
  <!-- Изображения товара -->
  <div class="block layer images">
    <h2>Изображение блога</h2>
    <input class='upload_image' name=image type=file>
    <input type=hidden name="delete_image" value="">
    {if $post->image}
    <ul>
      <li>
        <a href='#' class="delete"><img src='design/images/cross-circle-frame.png'></a>
        <img src="{$config->root_url}/{$config->blog_images_dir}{$post->image}" alt="" />
      </li>
    </ul>
    {/if}
  </div>
</div>
<!-- Правая колонка свойств товара (The End)-->

И в этом же файле находим где-то в начале конструкцию

<script>
$(function() {

});
</script>

В которую нужно добавить следующий код (именно добавить, а не заменить):

/*
 * Файл: [simpla/design/html/post.tpl]
 */
// Удаление изображений
$(".images a.delete").live('click', function() {
  $(this).closest("li").fadeOut(200, function() { $(this).remove(); });
  return false;
});

Уже скоро у нас всё будет готово, потерпите.
Открываем файл [simpla/PostAdmin.php], находим конструкцию

if(empty($post->id))
{
  $post->id = $this->blog->add_post($post);
  $post = $this->blog->get_post($post->id);
  $this->design->assign('message_success', 'added');
}
else
{
  $this->blog->update_post($post->id, $post);
  $post = $this->blog->get_post($post->id);
  $this->design->assign('message_success', 'updated');
}

и вставляем ВМЕСТО неё код:

/*
 * Файл: [simpla/PostAdmin.php]
 */
if(empty($post->id))
{
  $post->id = $this->blog->add_post($post);
  $this->design->assign('message_success', 'added');
}
else
{
  $this->blog->update_post($post->id, $post);
  $this->design->assign('message_success', 'updated');
}
// Удаление изображения
if($this->request->post('delete_image'))
{
  $this->blog->delete_image($post->id);
}
// Загрузка изображений
if($image = $this->request->files('image'))
{
  if( ! empty($image['name']))
  {
    $this->blog->delete_image($post->id);
    move_uploaded_file($image['tmp_name'], $this->config->root_dir.$this->config->blog_images_dir.$image['name']);
    $this->blog->update_post($post->id, array('image'=>$image['name']));
  }
}
$post = $this->blog->get_post($post->id);

Всё, осталось вставить вывод картинки в шаблон блога:

/*
 * Файл: [design/ваш_шаблон/html/blog.tpl]
 * Вставить в нужное место, где-то внутри цикла 
 * {foreach $posts as $post}
 *    ...
 * {/foreach}
 */
{if $post->image}
<a href="blog/{$post->url}">
  <img src="{$config->root_url}/{$config->blog_images_dir}{$post->image}" alt="" />
</a>
{/if}

Втроенная обрезалка картинок работать не будет, поэтому настраиваем внешний вид картинки через CSS.