PDA

Zobacz pełną wersję : [Rozwiązane] Ramka artykułu strona główna



master2007
09-05-2019, 21:12
Witam,
Mam pytanie czy mogę w jakiś sposób odseparować artykuły na stronie głównej za pomocą np ramki? Mam serwer z zainstalowaną joomla 3.9.5 i dodatkiem EF4 framework. Wszystko idzie mi ładnie ale nie mogę sobie poradzić z ramka artykułów. Chcę żeby każdy artykuł na stronie głównej z kategorii wyróżnione był otoczony ramką. Pomożecie?

Bazyl
09-05-2019, 21:28
Link do strony?!

master2007
10-05-2019, 07:02
Strona na chwilę obecną wyłączona. Ale tak jak na zrzucie ekranu mam artykuły jako wyróżnione żeby się wyświetlały na stronie głównej i chciał bym je obramować czy jakoś odznaczyć od innych artykułów.

Bazyl
10-05-2019, 09:20
Mam serwer z zainstalowaną joomla 3.9.5 i dodatkiem EF4 framework.

Jak rozumiem, wydaje Ci się, że taki zestaw może wygenerować tylko jeden kod.
Tak nie jest.

Uszanuj - proszę - mój czas i podaj link do strony.
Ewentualnie dodaj sobie w Paint ramki na obrazku ;-)

siristru
10-05-2019, 10:27
Chcę żeby każdy artykuł na stronie głównej z kategorii wyróżnione był otoczony ramką.

"Ramka" to w rozumieniu HTML "iframe". Ale z opisu wynika, że chcesz mieć "border" czyli zaznaczone krawędzie, cienkie linie wokół tekstu artykułu.
Czy tak?

Wykonać to jest bardzo łatwo, drobny kod CSS... ale jak napisał Bazyl - nikt nie jest w stanie Ci pomóc, podać kod bez wiedzy jak się nazywają elementy (kontenery) w kodzie Twojej strony. Bo czy:


.jakas-klasa {border: 1px solid #000;}

cokolwiek Ci pomoże? Wiesz jak sobie to poprawić? Gdzie dodać?

To dotyczy konkretnego przypadku, to nie jest przepis na bigos gdzie ktoś Ci podpowie z głowy jakie przyprawy dodać i nie będzie pytał w jakim garnku gotujesz. :)

Wrzuć stronę na żywy serwer, podaj link Bazylowi - pomoże Ci, to dobry chłopak.

master2007
12-06-2019, 20:56
Strona włączona. Adres:
www.gops-siemkowice.pl
I jak pisałem wcześniej chciał bym wyróżnione artykuły oddzielić ramkami wokół nich.

siristru
13-06-2019, 00:01
.blog-featured [class^="leading-"], .blog-featured .items-row .item {
border: 1px solid #ccc;
padding: 20px;
border-radius: 10px;
box-shadow: 0px 0px 3px 0px #444;
}

Efekt: http://prntscr.com/o13gy1

Dodaj kod do pliku: ROOT/templates/pcj-jzuk-niebieski/css/custom.9.css

.blog-featured [class^="leading-"] - ten ciąg klas identyfikuje artykuły oznaczone jako lead czyli artykuły będące tzw. Pozycjami głównymi. Użyłem w nich selektora atrybutu czyli wskazanie tylko części nazwy klasy, zaczynającej się od leading- wszystko co po niej następuje nie ma znaczenia. W ten sposób nie muszę wskazywać klasy z "imienia" tylko bardziej ogólnie.

.blog-featured .items-row .item - ten ciąg klas identyfikuje artykuły będące pozostałymi pozycjami.

master2007
13-06-2019, 07:14
.blog-featured [class^="leading-"], .blog-featured .items-row .item {
border: 1px solid #ccc;
padding: 20px;
border-radius: 10px;
box-shadow: 0px 0px 3px 0px #444;
}

Efekt: http://prntscr.com/o13gy1

Dodaj kod do pliku: ROOT/templates/pcj-jzuk-niebieski/css/custom.9.css

.blog-featured [class^="leading-"] - ten ciąg klas identyfikuje artykuły oznaczone jako lead czyli artykuły będące tzw. Pozycjami głównymi. Użyłem w nich selektora atrybutu czyli wskazanie tylko części nazwy klasy, zaczynającej się od leading- wszystko co po niej następuje nie ma znaczenia. W ten sposób nie muszę wskazywać klasy z "imienia" tylko bardziej ogólnie.

.blog-featured .items-row .item - ten ciąg klas identyfikuje artykuły będące pozostałymi pozycjami.

Kierowniku o to mi chodziło dzięki wielkie :) Dwa pytania jeszcze mam:
Jak zrobić żeby to obramowanie było też po wejściu w konkretny artykuł? Po wciśnięciu czytaj więcej?
Jak obramować moduły? Np pogody?

zwiastun
13-06-2019, 09:15
Usuń, proszę, stopke projektu KDS ze strony

siristru
13-06-2019, 12:15
Zastąp poprzedni kod tym:


.blog-featured [class^="leading-"], .blog-featured .items-row .item, #jm-maincontent .item-page {
border: 1px solid #ccc;
padding: 20px;
border-radius: 10px;
box-shadow: 0px 0px 3px 0px #444;
}

Dla modułu:


#jm-left .jm-module .jm-module-content {
border: 1px solid #ccc;
padding: 10px;
border-radius: 10px;
box-shadow: 0px 0px 3px 0px #444;
}

I proszę usuń stopkę projektu KDS ze stopki jak prosi Zwiastun. Kiedy zmieniasz wizualnie szablon projektu stworzony w ramach projektu, zmieniasz oryginalne założenie twórców. Tym samym by uszanować ich pracę - usuń stopkę projektową.

master2007
13-06-2019, 12:45
Zastąp poprzedni kod tym:


.blog-featured [class^="leading-"], .blog-featured .items-row .item, #jm-maincontent .item-page {
border: 1px solid #ccc;
padding: 20px;
border-radius: 10px;
box-shadow: 0px 0px 3px 0px #444;
}

Dla modułu:


#jm-left .jm-module .jm-module-content {
border: 1px solid #ccc;
padding: 10px;
border-radius: 10px;
box-shadow: 0px 0px 3px 0px #444;
}

I proszę usuń stopkę projektu KDS ze stopki jak prosi Zwiastun. Kiedy zmieniasz wizualnie szablon projektu stworzony w ramach projektu, zmieniasz oryginalne założenie twórców. Tym samym by uszanować ich pracę - usuń stopkę projektową.

Super panowie :) Dzięki wielkie za pomoc. Stopka usunięta. Znacie jakiś dodatek do guzika powrotu na górę strony?

siristru
13-06-2019, 13:04
Nom, używam tego: https://extensions.joomla.org/extension/skyline-scroll-to-top/

zwiastun
13-06-2019, 17:14
Znacie jakiś dodatek do guzika powrotu na górę strony

Masz zaimplementowany w szablonie.
Poniższy kod w pliku /tpl/footer.php :


<div id="jm-back-top" class="pull-right">
<a href="#jm-allpage"><?php echo JText::_( 'PLG_SYSTEM_JMFRAMEWORK_CONFIG_BACKTOTOP' );?><span class="icon-chevron-up"></span></a>
</div>


generuje przycisk powrotu do góry strony.

Mam, niestety, generalną uwagę. Cieszę się, że skorzystałeś z rozwiązania oferowanego w Kuźni Dostępnych Stron. To dobry wybór także dlatego, że OPS jako instytucja publiczna zobowiązany jest zapewnić dostępność swojej strony.
Niestety, dysponując całkiem dobrze wykonanym pod względem dostępności rozwiązaniem, dokonałeś zupełnie niepotrzebnych, a przy tym złych zmian, które tę dostępność zepsuły.
Strona startowa:

usunąłeś linki pomijające (w czym Ci przeszkadzały? czy w ogóle rozumiesz, do czego służą?),
masz 22 błędy kontrastu,
w artykułach zastosowałeś obustronne wyrównanie (justowanie),
obok paska dostępności dodałeś dwa przyciski, które nie są przyciskami, tylko linkami, a przy tym podczas tabulacji gubią fokus (prawdopodobnie ze względu na kolorystykę),
obrazkom brakuje zawartości atrybutu alt,
do prezentacji danych adresowych w stopce użyta została - nie wiadomo dlaczego - tabela, choć w pakietach projektu został opracowany do tego celu specjalny moduł z mikrodanymi.
kolejność elementów w górnym pasku jest niezgodna w porządkiem wizualnym

Czy umiesz sobie wyobrazić, jak musi być przykro ludziom, którzy się napracowali, żeby dać dobre rozwiązanie, a potem oglądają to swoje rozwiązanie i łapią się za głowy, co zostało z ich pracy?
Ale to nie jest tak istotne. Istotniejsze: Czy umiesz sobie wyobrazić, jaki zawód sprawiasz osobom, które spodziewają się dostępnej strony (chociażby dlatego, że jest tam pasek dostępności), a otrzymują stronę, jak zwykle...
Odpowiedz, po co korzystałeś z projektu Kuźnia Dostępnych Stron?

PS wyłącz sobie ten widżet uruchamiajacy panel stylizacji

master2007
13-06-2019, 21:27
Masz zaimplementowany w szablonie.
Poniższy kod w pliku /tpl/footer.php :


<div id="jm-back-top" class="pull-right">
<a href="#jm-allpage"><?php echo JText::_( 'PLG_SYSTEM_JMFRAMEWORK_CONFIG_BACKTOTOP' );?><span class="icon-chevron-up"></span></a>
</div>


generuje przycisk powrotu do góry strony.

Mam, niestety, generalną uwagę. Cieszę się, że skorzystałeś z rozwiązania oferowanego w Kuźni Dostępnych Stron. To dobry wybór także dlatego, że OPS jako instytucja publiczna zobowiązany jest zapewnić dostępność swojej strony.
Niestety, dysponując całkiem dobrze wykonanym pod względem dostępności rozwiązaniem, dokonałeś zupełnie niepotrzebnych, a przy tym złych zmian, które tę dostępność zepsuły.
Strona startowa:

usunąłeś linki pomijające (w czym Ci przeszkadzały? czy w ogóle rozumiesz, do czego służą?),
masz 22 błędy kontrastu,
w artykułach zastosowałeś obustronne wyrównanie (justowanie),
obok paska dostępności dodałeś dwa przyciski, które nie są przyciskami, tylko linkami, a przy tym podczas tabulacji gubią fokus (prawdopodobnie ze względu na kolorystykę),
obrazkom brakuje zawartości atrybutu alt,
do prezentacji danych adresowych w stopce użyta została - nie wiadomo dlaczego - tabela, choć w pakietach projektu został opracowany do tego celu specjalny moduł z mikrodanymi.
kolejność elementów w górnym pasku jest niezgodna w porządkiem wizualnym

Czy umiesz sobie wyobrazić, jak musi być przykro ludziom, którzy się napracowali, żeby dać dobre rozwiązanie, a potem oglądają to swoje rozwiązanie i łapią się za głowy, co zostało z ich pracy?
Ale to nie jest tak istotne. Istotniejsze: Czy umiesz sobie wyobrazić, jaki zawód sprawiasz osobom, które spodziewają się dostępnej strony (chociażby dlatego, że jest tam pasek dostępności), a otrzymują stronę, jak zwykle...
Odpowiedz, po co korzystałeś z projektu Kuźnia Dostępnych Stron?

PS wyłącz sobie ten widżet uruchamiajacy panel stylizacji

Jestem świeży w temacie tworzenia www na joomla. Podpowiesz mi co i jak ponaprawiać żeby strona miała ręcę i nogi? I była przystosowana do twoich poprawek?

zwiastun
13-06-2019, 21:36
Kwestie dostępności nie dotyczą tylko Joomla. Dotyczą wszystkich technologii projektowania stron i aplikacji internetowych.
Kilka rzeczy Ci wskazałem.
Ale proponuję zacząć od takiej zupełnie podstawowej lektury dotyczącej ustawy o dostępności cyfrowej stron internetowych i aplikacji mobilnych. Zajrzyj np. na stronę dostepnastrona.pl