PDA

Zobacz pełną wersję : Karuzela ze zdjęciami jako linkami do artykułów



kingu80
01-06-2019, 22:16
Cześć,
Próbuje stworzyć moduł karuzeli który będzie wyświetlał artykuły z danej kategorii. Moduł ma wyświetlać zdjęcia intro z tego artykułu tylko mam problem ponieważ chciałabym aby to zdjęcie było jednocześnie linkiem do pełnego artykułu. Czy macie pomysł jak to ustawić? Ewentualnie może znacie jakiś moduł który by to obsłużył. Obecnie mam taki efekt że stworzyłem karuzelę, ładnie wyświetla artykuły a w zasadzie ich zdjęcia intro ale za nic nie wiem jak zrobić aby to zdjęcie było klikalne i przekierowywało na artykuł :(

siristru
01-06-2019, 23:26
O ile pamięć służy już kilka razy o tym wspominałem na forum. Oczywiście, że można coś takiego zrobić.
Zawsze korzystam z Bootstrapa oraz domyślnego modułu Joomli "Migawki".
Migawki to świetny moduł który pozwala wyświetlać kilka artykułów zgodnie z zadanymi parametrami.
Trzeba zmodyfikować moduł tak by wyświetlał grafiki dodane do artykułu (najlepiej wykorzystać obrazek wprowadzenia w zakładce "Obrazki i linki)
Jeśli do tego się to obłoży kodem Bootstrapa to wychodzi piękny pokaz slajdów.

Przykład: https://muzeum.szczecin.pl/

kingu80
02-06-2019, 10:36
Czyli poczekaj, rozumiem że osadzasz jeden moduł w drugim? Bo z linka który wkleiłeś wygląda to tak jakbyś używał bootstrapowego modułu karuzeli i w nim osadziłeś ten moduł migawki, dobrze mówię? Właśnie to co pokazałeś było by idealne! Karuzela + tekst na zdjęciu jako link. To o to właśnie mi chodziło.

siristru
02-06-2019, 11:46
Czyli poczekaj, rozumiem że osadzasz jeden moduł w drugim?

Bosz, nie, nie :) To JEST moduł "Migawki" tylko przerobiony z użyciem kodu Bootstrap: https://getbootstrap.com/2.3.2/javascript.html#carousel
Jest tam osadzona pewna struktura a kod "migawki" dostarcza treść i obrazki.



<?php
/**
* @package Joomla.Site
* @subpackage mod_articles_news
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

defined('_JEXEC') or die;
?>
<div class="slajdy<?php echo $moduleclass_sfx; ?>">
<div id="carousel" class="carousel slide carousel-fade" data-ride="carousel">
<ol class="carousel-indicators">
<?php
$i=-1;
foreach ($list as $item) :
?>
<?php
$i++;
if($i==0) {
$klasa2='class="active"';
} else {
$klasa2='';
}
?>
<li data-target="#carousel" data-slide-to="<?php echo $i; ?>" <?php echo $klasa2; ?>><div class="kropka-licznik"></div></li>
<?php endforeach; ?>
</ol>
<div class="carousel-inner">
<?php
$i = 0;
foreach ($list as $item) : ?>
<?php
$i++;
if($i==1) {
$klasa='active';
} else {
$klasa='';
}
?>
<?php $images = json_decode($item->images);
$urls = json_decode($item->urls);
?>
<div class="item <?php echo $klasa; ?>" style="background-image: url('<?php echo $images->image_intro; ?>');">
<div class="wnetrze">
<?php if($urls->targeta == 1) { $oknodocelowe = 'target="_blank"'; } ?>
<?php if ($urls && (!empty($urls->urla))) { ?>
<a class="maska-link" href="<?php echo $urls->urla; ?>" <?php echo $oknodocelowe; ?>></a>
<?php } ?>
<div class="poziom1">
<div class="poziom2">
<?php require JModuleHelper::getLayoutPath('mod_articles_news', 'slajdy_item'); ?>
</div>
</div>
</div>
</div>
<?php endforeach; ?>

</div>
<a class="carousel-control left" href="#carousel" data-slide="prev">&lsaquo;</a>
<a class="carousel-control right" href="#carousel" data-slide="next">&rsaquo;</a>
</div>
<div class="wdol">
<a id="go" ><i class="fa fa-angle-down"></i></a>
</div>
</div>

to plik slajdy.php umiejscowiony w ROOT/templates/<nazwa-szablonu>/html/mod_articles_news


<?php
/**
* @package Joomla.Site
* @subpackage mod_articles_news
*
* @copyright Copyright (C) 2005 - 2015 Open Source Matters, Inc. All rights reserved.
* @license GNU General Public License version 2 or later; see LICENSE.txt
*/

defined('_JEXEC') or die;

$item_heading = $params->get('item_heading', 'h4');
?>
<?php if ($params->get('item_title')) : ?>

<<?php echo $item_heading; ?> class="newsflash-title<?php echo $params->get('moduleclass_sfx'); ?>">
<?php if ($params->get('link_titles') && $item->link != '') : ?>
<a href="<?php echo $item->link; ?>">
<?php echo $item->title; ?>
</a>
<?php else : ?>
<?php echo $item->title; ?>
<?php endif; ?>
</<?php echo $item_heading; ?>>

<?php endif; ?>

<?php if (!$params->get('intro_only')) : ?>
<?php echo $item->afterDisplayTitle; ?>
<?php endif; ?>

<?php echo $item->beforeDisplayContent; ?>

<?php echo $item->introtext; ?>

<?php if (isset($item->link) && $item->readmore != 0 && $params->get('readmore')) : ?>
<?php echo '<a class="readmore" href="' . $item->link . '">' . $item->linkText . '</a>'; ?>
<?php endif; ?>


to plik slajdy_item.php umiejscowiony w tym samym katalogu.

Konfiguracja samego modułu:

http://prntscr.com/nwjvaz

http://prntscr.com/nwjvf0

Oczywiście jeszzce trzeba to ostylować w CSS by wyglądalo odpowiednio ale to zależy od układu szablonu.