Funkcja "czytaj więcej"
Autor: Robert T.
Besucht 3572,
Followers 1,
Geteilt 0
Witam, czy istnieje w programie mozliwość dodania funkcji (przycisku) "czytaj więcej" ?
Tak aby na głównej stronie było np.: tylko jedno zdanie i póżniej taki przycisk aby rozwinąć temat. Jako przykład podam http://www.orzel.info.pl/
Jak to zrobić?
Gepostet am
Ale to nie wygląda jak typowe "czytaj więcej"
Każdy z przycisków prowadzi do pełnych informacji a strona główna zawiera tylko przygotowane osobno skróty informacji.
Mało tego każdy z tych przycisków prowadzi do jednej i te samej strony, jeżeli kliknę informację na samym dole to i tak muszę przewinąć wszyskie tematy.
Nie chcesz zrobić tak jak na tej stronie
Autor
No cóż, założyć nową subdomenę na której umieścić całą stronę i potem przewijać? Można i tak. Ale nie o to chodzi. Wygląda na to, że trzeba by do każdego "czytaj więcej" tworzyć subdomenę.
Ciekawe jak to robią duże serwisy? Pewnie mają bardziej funkcjonalne oprogramowanie do tworzenia stron.Arkadiusz, to jest rozwiązanie po części. Może jakieś inne propozycje?
Załatwi to polecenie Kotwica.
Nie mam pod ręką przykładu z "czytaj więcej" ale przykład "Aktualnosci" jest podobny, z zastosowaniem Kotwicy.
http://anduro.linuxpl.info/test01
Zrób stronę ukrytą i wpisz tam co chcesz a na stronie głównej podaj np. zdanie i przyciskiem graficznym lub tekstem z linkiem podaj stronę tą ukrytą. To jest najprostszy przykład tego co chcesz zrobić.
Subdomeny stosuje się dla całych witryn a nie dla pojedyńczych stron z serwisu.
Przykład subdomeny dla interia.pl
www.wideo.interia.pl
Witajcie
A może chodzi o takie "czytaj więcej" -> "rozwiń całość"
jak zrobiłem na jednej ze swoich stron
http://www.biuro-rachunkowe-goja.pl
Autor
Co do ukrytej strony to jest to rzeczywiście rozwiązanie. Dziękuję.
Darku, jak stworzyć "rozwiń całość" ? Podoba mi się rozwiązanie i o takie mi chodziło.
1) Na stronie tworzysz "komórkę" z kodem HTML na całej szerokości strony,
by zadziałała funkcja, którą trzeba zaznaczyć, "włącz automatyczną wysokość",
(ta funkcja działa, jak obok danej komórki nie ma innej, która by blokowała automatyczną wysokość)
dlaczego automatyczna wysokość? a to dlatego, że tekst będzie się rozwijał/zwijał i będzie potrzebował więcej/mniej miejsca
tam wpisujesz tekst wstępny w HTML zakończony:
<ahref="#lista1" onclick="lista('lista1'); return false;">rozwiń całość</a>
po tej "komendzie" wpisujesz
<div id="lista1">
i piszesz dalszą część tekstu
Oczywiście list może być więcej, czyli w/g zapotrzebowania
2) W zakładce [zaawansowane] obok [kod HTML] wpisujesz wygląd, czcionkę, rozmiar itp. rzeczy potrzebne do wyglądu tekstu dla przykładu:
#lista1, #lista2, #lista3, #lista4, #lista5 { display: none; font-family: "Georgia", ...itd.
p { text-align: justify; font-size:16px; ...itd. wszystko w/g swojego uznania
3) Teraz by to wszystko "zadziałało" potrzebny będzie script, który trzeba umieścić we właściwościach danej strony w zakładce [zaawansowane] [przed tagiem zamykającym sekcję BODY] :
<script type="text/javascript">
<!--
function lista(co) {
var obiekt = document.getElementById(co);
if (obiekt.style.display == 'block') {
obiekt.style.display = 'none';
} else {
obiekt.style.display = 'block';
}
}
-->
</script>
Po tych wszystkich trzech "zabiegach" wszystko powinno śmigać
Chyba w miarę jasno napisałem "poradnik"
i może komuś się przyda i być pomocny przy tworzeniu stron
Korzystający z jquery:
Sekcja HEAD
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
function op(obj) {
x=document.getElementById(obj);
$(x).slideToggle( "slow" );
}
</script>
A potem zwykłe komórki tekstowe z włączoną akceptacją kodu HTML. Każdy blok wiadomości w osobnym, polu to się równo układają.
1.
Piszemy treść pierwszą......<a href="#1" onClick="op('poka');">Pokaż</a>
<div name="1" id="poka" style="display: none;">
Oto ukryta cześć strony. Rozwija się po kliknięciu na przycisk, tekst, button, zdjęcie z atrybutem onClick="op('poka');".
TEXT ........
</div>
2.
Piszemy treść drugą....<a href="#2" onClick="op('poka1');">Pokaż</a>
<div name="2" id="poka1" style="display: none;">
Oto ukryta cześć strony. Rozwija się po kliknięciu na przycisk, tekst, button, zdjęcie z atrybutem onClick="op('poka');".
TEXT ........
</div>
Zwracamy uwagę żeby ponazywać odpowiednio te części:
a href="#1" / op(poka) / name="1" / id="poka"
dla drugiego pola
a href="#2" / op(poka1) / name="2" / id="poka1"
itd...
PRZYKŁAD DZIAŁANIA:
http://mezon.republika.pl/wiecej/index.html
Autor
Panowie Darku J. i Arku S. Dziękuję. Właśnie wziąłem to na na warsztat. Efekty jak tylko będą gotowe pokażę w linku w następnym poście.
Może warto, aby twórcy programu zainteresowali się nie tylko problemami technicznymi, jakie dostarcza oprogramowanie, ale również potrzebami i rozwiązaniami, jakie przedstawiają użytkownicy ich produktu. Ma to być z założenia program dostarczający prostych rozwiązań w budowie swojej strony nawet laikowi. Jeśli więc pojawia się taka potrzebna funkcja, jak zaprezentował Darek, Arkadiusz, to chyba nie ma większego problemu, żeby wprowadzić to w funkcjach oprogramowania. Takich „rzeczy” na forum jest więcej – może niech wydawca pochyli głowę i zainteresuje się rozwiązaniami podanymi na tacy przez jego klientów…
Autor
oto efekty wypróbowania kodów wraz z skryptami oraz funkcji kotwicy
http://sport.roberttomkow.pl/
Darku J. Z twoim kodem mam problem, nie działały mi kolejne listy #lista1, #lista2, #lista3 itd. być może coś zepsułem. Choć zaletą jest utworzenie po „rozwiń” komendy „zwiń”, która jest nie widoczna przed rozwinięciem.
Sposób Twój Arku S. działa mi prawidłowo w kolejnych „href="#1" href="#2" „ itd., ale nie mogłem stworzyć niewidocznego słowa przed rozwinięciem „zwiń” i dlatego na początku zamieściłem podwójną nazwę „więcej, zwiń”. Jeszcze ogarnąć muszę kolor czcionki w rozwijanych akapitach, bo wyraźnie robi inną niż główna i przy linkach. Po rozwinięciu dwóch linków widać wersy brązowe i czarne. Albo coś w kodzie muszę zmienić albo Website to psuje.
Przy galerii wykorzystałem funkcję „kotwicy” do niewidocznych podstron.
Sam Website X5 w wersji 11 lubi coś „sknocić” w trakcie pracy w porównaniu do poprzednich. Ma wyraźnie problem z plikami tymczasowymi. Zapisuję sobie obecnie kopię przed pracą, aby wszystkiego nie pisać od nowa. Raz mi się zdarzyło, że podczas zapisywania projektu się zawiesił, podczas próby importowania plik IWZIP był uszkodzony i cała praca od nowa. Poprzednie wersje były stabilniejsze.
Reasumując: Dziękuję za pomoc Panowie. Robert
Sposób Darka jest "kombinacją" jaką musimy często stosować żeby uzyskać to czego chcemy. Normalnie chyba każda tępawa, darmowa rzecz typu blog posiada opcję "more"... ale nie ma jej w standardzie Website... ale nie jestem zdziwiony.
Ponieważ uparty jesteś mam dla Ciebie chyba najlepsze rozwiązanie. Lepsze od tego co ja i Darek podaliśmy wcześniej i chyba zaspokaja Twoją potrzebę "czytaj więcej"
Kilka wskazówek gdyby ktoś chciał też wykożystać:
W tej częśći podajemy szerokość bloku tekstowego
.comment {
width: 600px;
A tutaj 100 oznacza po ilu znakach pojawi się napis więcej "..." oznacza ... a wiecęj i zwiń oznaczają dokładnie to co napisane
$(document).ready(function() {
var showChar = 100;
var ellipsestext = "...";
var moretext = "więcej";
var lesstext = "zwiń";
Reasumując - Wyizolować to co: 1. Przed tagiem zamykającym </HEAD> 2. Po tagu zamykającym </body> i 3. Reszta w "Html i gażety" wklejona
Oczywiście modyfikacji można podać wszystko ale to są chyba najistotniejsze elementy
Ściągnąłem też plik js, po to by go móc "lokalnie" wykorzystywać (żeby było śmieszniej nie trzeba podpinać pliku js, website ma plik jquery obsługujący ten prosty zestaw...)
Przykład wpakowania do szablonu Website:
http://www.mezon.republika.pl/more/index.html
Pliki do zassania html + plik sj
Autor
Bardzo dziękuję Arkadiuszu, Jeszcze w tym tygodniu przystąpię do realizacji. Sposób trafiony. Robert.
PS. wszystko rozciągnięte w czasie gdyż jestem laikiem w tej dziedzinie, do wczoraj nie wiedziałem co to "body" ale powoli podstawy poznaję. Robert.