Wsparcie » Zaawansowane » Skrypt wyświetlający stronę wywołaną przez niego

  • Witam,
    Czy ktoś mógłby mi stworzyć kod, który:

    Po kliknięciu w link (obrazek) będzie wyświetlał mi tekst danej strony (stworzonej przez panel administracyjny wordpressa)
    w miejscu, docelowym na stronie(footer) ?

    Chodzi mi dokładnie o to co teraz robi zwykłe menu, tylko że chciałbym sam przypisywać którą stronę i gdzie ma wyświetlić.

    Wiem, że nie jest to raczej zbyt trudne, ale jeszcze nie ogarniam na tyle wordpressa.

Viewing 4 replies - 1 through 4 (of 4 total)
  • wube

    (@wujek_bogdan)

    chcesz to zrobić bez przeładowania strony? jeśli tak to musisz treści ładować ajaxowo. Dla stron, które będziesz ładować ajaxem najlepiej przygotować własny template, tzn taki, który zawiera tylko content (bez headera i footera, samą treść wpisu) – nie jest to konieczne, ale zalecane.

    Tworzysz np. taki template:

    <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

    <div class=”page-content”>
    <article class=”post” id=”post-<?php the_ID(); ?>”>

    <h1 class=”pagetitle”><?php the_title() ?></h1>
    <div class=”entry”>
    <?php the_content(); ?>
    </div>

    </article>
    </div>

    <?php endwhile; endif; ?>

    Ze strony WordPressa nie wymaga to żadnych sztuczek, cała sprawa rozbija się o utworzenie w javascriptcie zapytania do odpowiedniej strony i wyświetlenia tej strony w odpowiednim miejscu.

    Ja to robię tak, że po kliknięciu w dany odnośnik, pobieram jego atrybut „href”, blokuję domyślne zachowanie (czyli przejście pod podany adres) i pobieram z tego adresu zawartość, a następnie wrzucam w odpowiedniego diva.

    Wygląda to mniej więcej tak:

    $(„nav a”).on(„click”, function(e) { // klikany element
    e.preventDefault(); // anulujemy domyślną akcję
    url = url + ” .page-content”; // adres url do którego kierujemy zapytanie
    var container = $(‚#container’); // element do którego wrzucamy treść
    container.load(url, function() {// ajaxowe wczytywanie treści w conainer
    // callback, który wykona się po załadowaniu treści
    })

    return false;
    }

    });

    To taki przykład na szybko, nie testowałem, bo kopiowałem z nieco bardziej skomplikowanego skryptu, ale ogólna zasada jest taka.

    Jak masz ochotę zobaczyć źródło to tutaj jest bardzo proste wdrożenie czegoś takiego: http://warsztatjezykowy.pl/

    hmm to wyglada rzeczywiście ciekawie, ale dla pojedyńczej strony…a jak to się zachowuje w przypadku kulku stron i kilku odnośników? Za każdym razem trzeba dublowac kod czy da się to jakoś zautomatyzowac?

    aaa i dlaczego footer i header tutaj cos zminia?

    wube

    (@wujek_bogdan)

    Przykład, który podałem wyżej to bardzo uproszczona wersja. żeby był uniwersalny, wystarczy poprawić to co pominąłem ;), tzn do zmiennej „url” nie jest przypisana żadna wartość a powinien być przypisany adres klikanego odnośnika. przepraszam za błąd. pisałem na szybko.

    var url = $(this).attr(‚href’)

    zobacz w źródło strony, którą podałem. w pliku functions.js masz nieco bardziej rozbudowany przykład (nawigacja oparta na #haszach, ładowanie overlay, ajaxowy loader).

    A czemu pomijać header i footer? bo to nadmiarowe dane, które i tak nie zostaną wyświetlone, ponieważ ajaxowe zapytanie w przykładzie powyżej pobiera tylko to co znajduje się wewnątrz elementu .page-content strony źródłowej. Więc niepotrzebnie pobieralibyśmy o wiele więcej danych niż chcemy wyświetlić. Oczywiście będzie działać, ale czas ładowania strony nieco się wydłuży. Krótko mówiąc – nieoptymalnie.

    ok kumam, dzięki za pomoc… Skończę jeden szablon i wrócę do tego przy którym potrzebowałem pluginu.

    Będę wdzięczny za pomoc jeszcze w tym temacie, bo już totalnie nie wiem o co może chodzić próbowałem n kombinacji i nic.. http://pl.forums.wordpress.org/topic/jqueryscrollpane-nie-wyswietla-tresci?replies=2

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Skrypt wyświetlający stronę wywołaną przez niego’ is closed to new replies.