• Apr
  • 2012
  • 28
  • Categoria: Joomla
  • Scritto da Andrea Rossi

Come configurare il nostro joomla 2.5, per visualizzare nelle ricerche, le immagini degli articoli? 2 File da modificare, un paio di attenzioni da tenere conto et voilà, il gioco è fatto

Override template: Ricerca con Thumb

Funziona sujoomla 2.5

Girovagando per il forum, mi sono imbattuto in questa discussione, Come visualizzare la thumb del contenuto nei risultati di ricerca. Con l'override ed una piccola modifica per il prelievo dati, il risultato è facilmente ottenibile e molto più gestibile!

Attenzione: questa non è propriamente una tecnica di override, in quanto si riscrive una parte di codice. Pertanto si invita a fare una copia ed a tenerla sul pc in tutta sicurezza.

Quanto segue è la procedura per prelevare i dati, mentre più in basso potrete vedere i codici per lo stile di visualizzazione. Entrambi gli aspetti sono fondamentali per il risultato finale!

Avvertenze

  1. Consideriamo Thumbnail del'articolo, solamente l'immagine inserita nel campo "immagine articolo intero". Pertanto, se vorrete fare delle modifiche od estendere questa funzionalità, possiamo parlarne sul forum alla discussione qui indicata, oppure nei commenti qui sotto
  2. Le immagini che potrete inserire avranno dimensione diversa da quelle usate da me, pertanto fate qualche test ed adattate il codice css/html/php oppure caricate un determinato formato immagine.
Ti ricordo che tutto questo è per poter controllare meglio lo stile e l'integrazione di questa nuova funzionalità, nel tuo sito, senza l'ausilio di plugin potenzialmente dannosi.


Prelievo Dati

File da Salvare

Scaricate questa cartella root/plugins/search/content e fatene due copie: una per il backup ed una su cui andremo a lavorare.

File da Modificare

Cominciamo ritoccando il codice del file root/plugins/search/content/content.php. Ciò che facciamo, è di aggiungere un semplice campo, per il recupero delle informazioni "images".

1 Recupero Informazioni

Raggiungiamo questa riga (153 circa)

$query->select('a.title AS title, a.metadesc, a.metakey, a.created AS created,');
ed aggiungiamo a.images AS images
$query->select('a.title AS title, a.metadesc, a.metakey, a.created AS created,a.images AS images');

2 Recupero Informazioni

Raggiungiamo questa riga (163 circa)

$query->group('a.id, a.title, a.metadesc, a.metakey, a.created, a.introtext, a.fulltext, c.title, a.alias, c.alias, c.id, a.images');
ed aggiungiamo a.images 
$query->group('a.id, a.title, a.metadesc, a.metakey, a.created, a.introtext, a.fulltext, c.title, a.alias, c.alias, c.id, a.images');

3 Recupero Informazioni

Raggiungiamo questa riga (209 circa)

$query->select('a.title AS title, a.metadesc, a.metakey, a.created AS created,'
ed aggiungiamo a.images AS images,
$query->select('a.title AS title, a.metadesc, a.metakey, a.created AS created,a.images AS images,'
Caricate tutto il file nella cartella root/plugins/search/content/content.php.

Verifica Errori

Se dovesse apparire un errore del tipo

Warning: Invalid argument supplied for foreach() in root/plugins/search/content/content.php on line 258

La causa è dovuta alle virgole: ricontrollate bene il codice completo. Con queste modifiche stiamo lavorando con MySql, pertanto sbagliare una virgola tra gli elementi da visualizzare è abbastanza grave (anche se viene rilevato come un warning).

Risultato finale(1/2)

Ecco il codice per intero

  1. <?php
  2. /**
  3.  * @copyright Copyright (C) 2005 - 2012 Open Source Matters, Inc. All rights reserved.
  4.  * @license GNU General Public License version 2 or later; see LICENSE.txt
  5.  */ // no direct access
  6. defined('_JEXEC') or die; require_once JPATH_SITE.'/components/com_content/router.php'; /**
  7.  * Content Search plugin
  8.  *
  9.  * @package Joomla.Plugin
  10.  * @subpackage Search.content
  11.  * @since 1.6
  12.  */
  13. class plgSearchContent extends JPlugin
  14. {
  15.  /**
  16.  * @return array An array of search areas
  17.  */
  18.  function onContentSearchAreas()
  19.  {
  20.  static $areas = array(
  21.  'content' => 'JGLOBAL_ARTICLES'
  22.  );
  23.  return $areas;
  24.  } /**
  25.  * Content Search method
  26.  * The sql must return the following fields that are used in a common display
  27.  * routine: href, title, section, created, text, browsernav
  28.  * @param string Target search string
  29.  * @param string mathcing option, exact|any|all
  30.  * @param string ordering option, newest|oldest|popular|alpha|category
  31.  * @param mixed An array if the search it to be restricted to areas, null if search all
  32.  */
  33.  function onContentSearch($text, $phrase='', $ordering='', $areas=null)
  34.  {
  35.  $db = JFactory::getDbo();
  36.  $app = JFactory::getApplication();
  37.  $user = JFactory::getUser();
  38.  $groups = implode(',', $user->getAuthorisedViewLevels());
  39.  $tag = JFactory::getLanguage()->getTag(); require_once JPATH_SITE.'/components/com_content/helpers/route.php';
  40.  require_once JPATH_SITE.'/administrator/components/com_search/helpers/search.php'; $searchText = $text;
  41.  if (is_array($areas)) {
  42.  if (!array_intersect($areas, array_keys($this->onContentSearchAreas()))) {
  43.  return array();
  44.  }
  45.  } $sContent = $this->params->get('search_content', 1);
  46.  $sArchived = $this->params->get('search_archived', 1);
  47.  $limit = $this->params->def('search_limit', 50); $nullDate = $db->getNullDate();
  48.  $date = JFactory::getDate();
  49.  $now = $date->toSql(); $text = trim($text);
  50.  if ($text == '') {
  51.  return array();
  52.  } $wheres = array();
  53.  switch ($phrase) {
  54.  case 'exact':
  55.  $text = $db->Quote('%'.$db->escape($text, true).'%', false);
  56.  $wheres2 = array();
  57.  $wheres2[] = 'a.title LIKE '.$text;
  58.  $wheres2[] = 'a.introtext LIKE '.$text;
  59.  $wheres2[] = 'a.fulltext LIKE '.$text;
  60.  $wheres2[] = 'a.metakey LIKE '.$text;
  61.  $wheres2[] = 'a.metadesc LIKE '.$text;
  62.  $where = '(' . implode(') OR (', $wheres2) . ')';
  63.  break; case 'all':
  64.  case 'any':
  65.  default:
  66.  $words = explode(' ', $text);
  67.  $wheres = array();
  68.  foreach ($words as $word) {
  69.  $word = $db->Quote('%'.$db->escape($word, true).'%', false);
  70.  $wheres2 = array();
  71.  $wheres2[] = 'a.title LIKE '.$word;
  72.  $wheres2[] = 'a.introtext LIKE '.$word;
  73.  $wheres2[] = 'a.fulltext LIKE '.$word;
  74.  $wheres2[] = 'a.metakey LIKE '.$word;
  75.  $wheres2[] = 'a.metadesc LIKE '.$word;
  76.  $wheres[] = implode(' OR ', $wheres2);
  77.  }
  78.  $where = '(' . implode(($phrase == 'all' ? ') AND (' : ') OR ('), $wheres) . ')';
  79.  break;
  80.  } $morder = '';
  81.  switch ($ordering) {
  82.  case 'oldest':
  83.  $order = 'a.created ASC';
  84.  break; case 'popular':
  85.  $order = 'a.hits DESC';
  86.  break; case 'alpha':
  87.  $order = 'a.title ASC';
  88.  break; case 'category':
  89.  $order = 'c.title ASC, a.title ASC';
  90.  $morder = 'a.title ASC';
  91.  break; case 'newest':
  92.  default:
  93.  $order = 'a.created DESC';
  94.  break;
  95.  } $rows = array();
  96.  $query = $db->getQuery(true); // search articles
  97.  if ($sContent &amp;&amp; $limit > 0)
  98.  {
  99.  $query->clear();
  100.  //sqlsrv changes
  101.  $case_when = ' CASE WHEN ';
  102.  $case_when .= $query->charLength('a.alias');
  103.  $case_when .= ' THEN ';
  104.  $a_id = $query->castAsChar('a.id');
  105.  $case_when .= $query->concatenate(array($a_id, 'a.alias'), ':');
  106.  $case_when .= ' ELSE ';
  107.  $case_when .= $a_id.' END as slug'; $case_when1 = ' CASE WHEN ';
  108.  $case_when1 .= $query->charLength('c.alias');
  109.  $case_when1 .= ' THEN ';
  110.  $c_id = $query->castAsChar('c.id');
  111.  $case_when1 .= $query->concatenate(array($c_id, 'c.alias'), ':');
  112.  $case_when1 .= ' ELSE ';
  113.  $case_when1 .= $c_id.' END as catslug'; $query->select('a.title AS title, a.metadesc, a.metakey, a.created AS created,a.images AS images');
  114.  $query->select($query->concatenate(array('a.introtext', 'a.fulltext')).' AS text');
  115.  $query->select('c.title AS section, '.$case_when.','.$case_when1.', '.'\'2\' AS browsernav'); $query->from('#__content AS a');
  116.  $query->innerJoin('#__categories AS c ON c.id=a.catid');
  117.  $query->where('('. $where .')' . 'AND a.state=1 AND c.published = 1 AND a.access IN ('.$groups.') '
  118.  .'AND c.access IN ('.$groups.') '
  119.  .'AND (a.publish_up = '.$db->Quote($nullDate).' OR a.publish_up <= '.$db->Quote($now).') '
  120.  .'AND (a.publish_down = '.$db->Quote($nullDate).' OR a.publish_down >= '.$db->Quote($now).')' );
  121.  $query->group('a.id, a.title, a.metadesc, a.metakey, a.created, a.introtext, a.fulltext, c.title, a.alias, c.alias, c.id, a.images');
  122.  $query->order($order); // Filter by language
  123.  if ($app->isSite() &amp;&amp; $app->getLanguageFilter()) {
  124.  $query->where('a.language in (' . $db->Quote($tag) . ',' . $db->Quote('*') . ')');
  125.  $query->where('c.language in (' . $db->Quote($tag) . ',' . $db->Quote('*') . ')');
  126.  } $db->setQuery($query, 0, $limit);
  127.  $list = $db->loadObjectList();
  128.  $limit -= count($list); if (isset($list))
  129.  {
  130.  foreach($list as $key => $item)
  131.  {
  132.  $list[$key]->href = ContentHelperRoute::getArticleRoute($item->slug, $item->catslug);
  133.  }
  134.  }
  135.  $rows[] = $list;
  136.  } // search archived content
  137.  if ($sArchived &amp;&amp; $limit > 0)
  138.  {
  139.  $searchArchived = JText::_('JARCHIVED'); $query->clear();
  140.  //sqlsrv changes
  141.  $case_when = ' CASE WHEN ';
  142.  $case_when .= $query->charLength('a.alias');
  143.  $case_when .= ' THEN ';
  144.  $a_id = $query->castAsChar('a.id');
  145.  $case_when .= $query->concatenate(array($a_id, 'a.alias'), ':');
  146.  $case_when .= ' ELSE ';
  147.  $case_when .= $a_id.' END as slug'; $case_when1 = ' CASE WHEN ';
  148.  $case_when1 .= $query->charLength('c.alias');
  149.  $case_when1 .= ' THEN ';
  150.  $c_id = $query->castAsChar('c.id');
  151.  $case_when1 .= $query->concatenate(array($c_id, 'c.alias'), ':');
  152.  $case_when1 .= ' ELSE ';
  153.  $case_when1 .= $c_id.' END as catslug'; $query->select('a.title AS title, a.metadesc, a.metakey, a.created AS created,a.images AS images'
  154.  .$query->concatenate(array("a.introtext", "a.fulltext")).' AS text,'
  155.  .$case_when.','.$case_when1.', '
  156.  .'c.title AS section, \'2\' AS browsernav');
  157.  //.'CONCAT_WS("/", c.title) AS section, \'2\' AS browsernav' );
  158.  $query->from('#__content AS a');
  159.  $query->innerJoin('#__categories AS c ON c.id=a.catid AND c.access IN ('. $groups .')');
  160.  $query->where('('. $where .') AND a.state = 2 AND c.published = 1 AND a.access IN ('. $groups
  161.  .') AND c.access IN ('. $groups .') '
  162.  .'AND (a.publish_up = '.$db->Quote($nullDate).' OR a.publish_up <= '.$db->Quote($now).') '
  163.  .'AND (a.publish_down = '.$db->Quote($nullDate).' OR a.publish_down >= '.$db->Quote($now).')' );
  164.  $query->order($order);
  165.  // Filter by language
  166.  if ($app->isSite() &amp;&amp; $app->getLanguageFilter()) {
  167.  $query->where('a.language in (' . $db->Quote($tag) . ',' . $db->Quote('*') . ')');
  168.  $query->where('c.language in (' . $db->Quote($tag) . ',' . $db->Quote('*') . ')');
  169.  } $db->setQuery($query, 0, $limit);
  170.  $list3 = $db->loadObjectList(); // find an itemid for archived to use if there isn't another one
  171.  $item = $app->getMenu()->getItems('link', 'index.php?option=com_content&amp;view=archive', true);
  172.  $itemid = isset($item->id) ? '&amp;Itemid='.$item->id : ''; if (isset($list3))
  173.  {
  174.  foreach($list3 as $key => $item)
  175.  {
  176.  $date = JFactory::getDate($item->created); $created_month = $date->format("n");
  177.  $created_year = $date->format("Y");
  178. $list3[$key]->href = JRoute::_('index.php?option=com_content&amp;view=archive&amp;year='
  179. .$created_year.'&amp;month='.$created_month.$itemid);
  180.  }
  181.  } $rows[] = $list3;
  182.  } $results = array();
  183.  if (count($rows))
  184.  {
  185.  foreach($rows as $row)
  186.  {
  187.  $new_row = array();
  188.  foreach($row as $key => $article) {
  189.  if (searchHelper::checkNoHTML($article, $searchText, array('text', 'title', 'metadesc', 'metakey'))) {
  190.  $new_row[] = $article;
  191.  }
  192.  }
  193.  $results = array_merge($results, (array) $new_row);
  194.  }
  195.  }return $results;


Visualizzazione

Ora che abbiamo ricavato i dati, possiamo dedicarci alla loro visualizzazione, pertanto fate il backup di questo file root/component/com_search/views/search/tmpl/default_results.php perchè dovremo lavorarci su.

Struttura HTML

Dobbiamo modificare il contenuto del foreach, pertanto, buttiamo via quello che c'è al suo interno ed inseriamo

<div style="clear:both">
 <dt class="result-title">
 <span style="font-size:20px"><?php echo $this->pagination->limitstart + $result->count.'. ';?></span>
 <?php
 $result_url="";
 if ($result->href) :
 $result_url="<a href=\"".JRoute::_($result->href)."\" target=\"_blank\">".$this->escape($result->title)."</a>";
 else:
 $result_url=$this->escape($result->title);
 endif; echo $result_url;?>
 </dt>
 <?php /*Is there some images?*/
 $images = json_decode($result->images);
 $emptyimage=0;
if (isset($images->image_fulltext) and !empty($images->image_fulltext)) :?>
 <div class="result-thumb">
 <a href="<?php echo JRoute::_($result->href);?>">
 <img src="<?php echo $images->image_fulltext; ?>" />
 </a>
 <span style="font-size:10px;"><?php echo $images->image_fulltext_caption; ?></span>
 </div>
<?php else : $emptyimage=1;?>
<?php endif; /*End images*/?>
 <div class="result-detail"<?php if ($emptyimage==1) echo "style=\"width:100%;\"";?>>
 <dd class="result-misc">
 <?php if ($this->params->get('show_date')) : ?>
 &amp;bull; <?php echo JText::sprintf('JGLOBAL_CREATED_DATE_ON', $result->created); ?>
 <?php endif; ?>
 <?php if ($result->section) : ?>
 <span class="small<?php echo $this->pageclass_sfx; ?>">
 &amp;bull; <?php $title = $this->escape($result->section);
 $url = '<a href="'.JRoute::_(ContentHelperRoute::getCategoryRoute($result->catslug)).'">'.$title.'</a>';
 echo $url;?>
 </span>
 <?php endif; ?>
 </dd>
 <dd class="result-text">
 <?php echo $result->text; ?>
 </dd>
 </div>
</div>
<?php endforeach; ?>
Per aiutarmi nella costruzione, ho utilizzato la versione base/default del file per stampare gli articoli, in quanto i dati provengono dalla stessa tabella. Il file in questione è root/component/com_content/views/article/tmpl/default.php più o meno dalla riga 162; cercate la parte relativa alle immagini e vedrete come le gestice. Se confrontate quanto fatto sino ad ora, con quest'ultimo file, noterete delle belle somiglianze!

Effetto Css

Largo alla fantasia, ma io ho optato per qualcosa di semplice

dt.result-title{margin:5px 0px;
 padding:5px 0px;
}
div.result-thumb{
 float:left;
 width:200px;
 border-right:2px solid #DDD;
 padding-right:10px;
}
div.result-thumb img{
 float:left;
 width:90%;
 height:90%;
 display:block;
}
div.result-detail{
 float:left;
 width:378px;
}
div.result-detail dd{
 -webkit-margin-start:10px;
}
L'unica nota per questo semplicissimo script css sono i float, width e webkit: ho voluto posizionare l'immagine a sinistra del contenuto, tutto qui. Mentre per l'ultimo, ho notato un comportamento particolare con chrome, dove aggiunge 40px di margine. Io li ho impostati a 10px, tutto qui.

Risultato finale (2/2)

Ecco il quest'ultimo file per intero

  1. <?php
  2. /**
  3.  * @package Joomla.Site
  4.  * @subpackage com_search
  5.  * @copyright Copyright (C) 2005 - 2012 Open Source Matters, Inc. All rights reserved.
  6.  * @license GNU General Public License version 2 or later; see LICENSE.txt
  7.  */ // no direct access
  8. defined('_JEXEC') or die;
  9. ?>
  10. <style>
  11. dt.result-title{
  12.  margin:5px 0px;
  13.  padding:5px 0px;
  14. }
  15. div.result-thumb{
  16.  float:left;
  17.  width:200px;
  18.  border-right:2px solid #DDD;
  19.  padding-right:10px;
  20. }
  21. div.result-thumb img{
  22.  float:left;
  23.  width:90%;
  24.  height:90%;
  25.  display:block;
  26. }
  27. div.result-detail{
  28.  float:left;
  29.  width:378px;
  30. }
  31. div.result-detail dd{
  32.  -webkit-margin-start:10px;
  33. }
  34. </style>
  35. <dl class="search-results<?php echo $this->pageclass_sfx; ?>">
  36. <?php foreach($this->results as $result) : ?>
  37. <div style="clear:both">
  38.  <dt class="result-title">
  39.  <span style="font-size:20px"><?php echo $this->pagination->limitstart + $result->count.'. ';?></span>
  40.  <?php
  41.  $result_url="";
  42.  if ($result->href) :
  43.  $result_url="<a href=\"".JRoute::_($result->href)."\" target=\"_blank\">".$this->escape($result->title)."</a>";
  44.  else:
  45.  $result_url=$this->escape($result->title);
  46.  endif; echo $result_url;?>
  47.  </dt>
  48.  <?php /*Is there some images?*/
  49.  $images = json_decode($result->images);
  50.  $emptyimage=0;
  51. if (isset($images->image_fulltext) and !empty($images->image_fulltext)) :?>
  52.  <div class="result-thumb">
  53.  <a href="<?php echo JRoute::_($result->href);?>">
  54.  <img src="<?php echo $images->image_fulltext; ?>" />
  55.  </a>
  56.  <span style="font-size:10px;"><?php echo $images->image_fulltext_caption; ?></span>
  57.  </div>
  58. <?php else : $emptyimage=1;?>
  59. <?php endif; /*End images*/?>
  60.  <div class="result-detail"<?php if ($emptyimage==1) echo "style=\"width:100%;\"";?>>
  61.  <dd class="result-misc">
  62.  <?php if ($this->params->get('show_date')) : ?>
  63.  &amp;bull; <?php echo JText::sprintf('JGLOBAL_CREATED_DATE_ON', $result->created); ?>
  64.  <?php endif; ?>
  65.  <?php if ($result->section) : ?>
  66.  <span class="small<?php echo $this->pageclass_sfx; ?>">
  67.  &amp;bull; <?php $title = $this->escape($result->section);
  68.  $url = '<a href="'.JRoute::_(ContentHelperRoute::getCategoryRoute($result->catslug)).'">'.$title.'</a>';
  69.  echo $url;?>
  70.  </span>
  71.  <?php endif; ?>
  72.  </dd>
  73.  <dd class="result-text">
  74.  <?php echo $result->text; ?>
  75.  </dd>
  76.  </div>
  77. </div>
  78. <?php endforeach; ?>
  79. </dl><div class="pagination">
  80.  <?php echo $this->pagination->getPagesLinks(); ?>
  81. </div>

Effetto Finale

Questa volta niente codice, ma una immagine dalla versione, in locale, del mio sito.

Ecco l'effetto di tutte le modifiche riportate qui sopra

Che ne pensate???

  • Dettagli

  • Condividi