13.05.2015, 07:30
Hej,
w ostatnim czasie szukałem czegoś a'la Fit on Page dla MyBB 1.8, ale niestety poszukiwania nie przyniosły oczekiwanego rezultatu. Nie chciałem grzebać w kodzie pluginu, a automatyczne dopasowywanie obrazków dostępne w najnowszej wersji forum nie spełniało moich oczekiwań - chciałem, aby obrazki po kliknięciu na nie się powiększały, a domyślnie były raczej miniaturkami.
Postanowiłem więc zaaplikować Fancyboxa. Nie jest to trudne, ba poradnik ten jest bardzo, bardzo prosty. Z góry uprzedzam: nie wszędzie musi działać, testowałem na stylu bazującym na domyślnym z MyBB 1.8. Dobra, do dzieła.
Dodajemy poniższy kod do styli CSS używanych na forum:
Dzięki temu zbyt duże obrazki w postach będą zmniejszane. Te 400 px to tylko przykład, mi odpowiada właśnie taka wartość.
Pobieramy fancybox i wrzucamy na serwer
http://fancyapps.com/fancybox/3/
Pliki powinny znajdować się w katalogu /fancybox obok głównych plików naszego forum.
Edytujemy szablon headerinclude i za {$stylesheets} dodajemy kod:
Kod załącza Fancyboxa, a także dorzuca linki do obrazków, którego go nie mają (konieczne, aby działało prawidłowo). Jeżeli ktoś wrzucał obrazek z linkiem, nie będzie on modyfikowany. Każdy może samodzielnie dodać fragment, który doda klasę fancybox także do takich obrazków.
Edytujemy szablon postbit_attachments_thumbnails_thumbnail i zamianiamy:
na:
Dzięki temu również załączniki będą otwierane w taki sposób.
W sumie to wszystko, zapisujemy, gotowe.
Opcjonalnie możemy zawartość pliku CSS z paczki fancybox zapisać jako nowy arkusz w naszym stylu.
w ostatnim czasie szukałem czegoś a'la Fit on Page dla MyBB 1.8, ale niestety poszukiwania nie przyniosły oczekiwanego rezultatu. Nie chciałem grzebać w kodzie pluginu, a automatyczne dopasowywanie obrazków dostępne w najnowszej wersji forum nie spełniało moich oczekiwań - chciałem, aby obrazki po kliknięciu na nie się powiększały, a domyślnie były raczej miniaturkami.
Postanowiłem więc zaaplikować Fancyboxa. Nie jest to trudne, ba poradnik ten jest bardzo, bardzo prosty. Z góry uprzedzam: nie wszędzie musi działać, testowałem na stylu bazującym na domyślnym z MyBB 1.8. Dobra, do dzieła.
1 Dodanie stylów .css
Dodajemy poniższy kod do styli CSS używanych na forum:
.scaleimages img {
max-width: 400px;
max-height: 400px;
}
2 Załączamy fancybox'a
Pobieramy fancybox i wrzucamy na serwer
http://fancyapps.com/fancybox/3/
Pliki powinny znajdować się w katalogu /fancybox obok głównych plików naszego forum.
3 Edycja szablonów
Edytujemy szablon headerinclude i za {$stylesheets} dodajemy kod:
<link rel="stylesheet" href="/fancybox/jquery.fancybox.min.css" type="text/css" media="screen" />
<script type="text/javascript" src="/fancybox/jquery.fancybox.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('.post_body img').each(function() {
var currentImage = $(this);
if (currentImage.hasClass('smilie') == false && currentImage.parent().is('a') == false) {
currentImage.wrap("<a target='_blank' data-fancybox data-type='image' href='" + currentImage.attr("src") + "'</a>");
}
});
});
</script>
Kod załącza Fancyboxa, a także dorzuca linki do obrazków, którego go nie mają (konieczne, aby działało prawidłowo). Jeżeli ktoś wrzucał obrazek z linkiem, nie będzie on modyfikowany. Każdy może samodzielnie dodać fragment, który doda klasę fancybox także do takich obrazków.
Edytujemy szablon postbit_attachments_thumbnails_thumbnail i zamianiamy:
<a href="attachment.php?aid={$attachment['aid']}"
na:
<a href="attachment.php?aid={$attachment['aid']}" data-fancybox="data-{$attachment['aid']}" data-type="image"
Dzięki temu również załączniki będą otwierane w taki sposób.
W sumie to wszystko, zapisujemy, gotowe.
Opcjonalnie możemy zawartość pliku CSS z paczki fancybox zapisać jako nowy arkusz w naszym stylu.