Dodanie skryptu PHP do podstrony - WordPress

0

Witam.

Klient zlecił mi stworzenie pewnego skryptu pobierającego prognozę pogody z pewnej norweskiej strony. Moim zadaniem było pobranie kierunku wiatru, temperatury, ewentualnych opadów itd. Na podstawie pobranych danych miałem to wszystko oprawić ładnie HTMLem. Wszystko mam gotowe, tyle że gość chce, abym mu to wprowadził teraz w pewną już istniejącą podstronę na WordPressie. Ma tam już jakieś informacje o pogodzie, ja mam w środek tego co on już sobie tam powrzucał, dodać tą prognozę pogody. Moje pytanie - w jaki sposób mam to tam umieścić? Skrypt jest częściowo napisany w PHP (głównie dane pobierające te sztywne dane na temat prognozy), część jest w HTML + CSS. Do tego dochodzi jedna funkcja w javascript.

Jako, że nigdy nie miałem do czynienia z WordPressem, potrzebuję wskazówek jak ten skrypt mogę tam umieścić. Orientuje się ktoś?

Pozdrawiam.

0

zainstaluj sobie na lokalnym serwerze i spróbuj do dodać w pliku page.php pamiętając o ID strony-podstrony, więcej doczytasz poznając strukturę plików samego WP (wp codex itp.)

0

Możesz chociaż jakiś przykład zarzucić? Do jakiej zmiennej powinienem odwołać się w warunku, żeby to ID przyrównać? Rozumiem, że struktura będzie prosta:

if ( $page_id == 16 )
{
    // mój kod
}

Pytanie jak powinna wyglądać zmienna $page_id. No i kolejna sprawa - jeśli potrzebowałbym dodać tam zarówno kod PHP, HTML, CSS i javascript to to nie będzie kolidowało i śmiało mogę to tam wepchnąć? Chciałbym też zaznaczyć, że ten kod muszę wstawić w środku jakichś tam innych treści, które gość sam zamieścił z poziomu panelu administracyjnego. Uda się to tak zrobić?

0

No cóż, ten cały webdev jest po prostu fascynujący :-) Jedno z możliwych rozwiązań:

weather.php:

<?php
$output =
'<UL style="color: red; font-weight: bold; border: 4px solid black; '
.'width: 200px; height:150px;">'
.'<LI>Pressure 1020 hPa</LI>'
.'<LI>Temperature 20 st. C</LI>'
.'<LI>Wind 5 m/s</LI>'
.'</UL>';

echo $output;
?>

index.php (albo cokolwiek innego):

<!DOCTYPE HTML>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
    </head>
    <body>
        <div id="weather-data">
        </div>
    </body>
</html>
<script type="text/javascript">
jQuery(document).ready(function ()
{
    $.ajax(
    {
        type: "GET",
        url: "weather.php",
        data: {},
        dataType: "text",
        success: function(data)
        {
            $("#weather-data").html(data);
	}
    });
});
</script>

Wystarczy więc że dodam sobie tego div-a o id weather-data gdzieś tam i dodam sobie ten skrypt JS u dołu i w ten sposób AJAX-em właduję te dane. To co wypluwa dane o pogodzie w postaci HTML nie musi być wcale w PHP ale właściwie w dowolnej technologii.

0

W pliku single.php (prawie na pewno w tym, choć to zależy od motywu) w interesującym cię miejscu piszesz:

if (is_page( identyfikator lub 'nazwa strony' )) {

pogoda lalala trutututu

}
0

Uda mi się wtedy w środek treści tej strony (treść dodana z poziomu panelu), wstawić tą pogodę?

0

Bez znajomości Wordpressa to sobie możesz. Ja zrobiłem próbę na zainstalowanym u siebie Wordpressie, na przykładowym powitalnym tekście, udało mi się odnaleźć plik: wp-content/themes/twentyfifteen/content-page.php a mam ten motyw zainstalowany, wstawiłem tego div-a w tą część kodu:

	<div class="entry-content">
		<?php the_content(); ?>
               <!-- tutaj to wstawione -->
                <div id="weather-data"></div>
                <!-- koniec -->
                <?php
			wp_link_pages( array(
				'before'      => '<div class="page-links"><span class="page-links-title">' . __( 'Pages:', 'twentyfifteen' ) . '</span>',
				'after'       => '</div>',
				'link_before' => '<span>',
				'link_after'  => '</span>',
				'pagelink'    => '<span class="screen-reader-text">' . __( 'Page', 'twentyfifteen' ) . ' </span>%',
				'separator'   => '<span class="screen-reader-text">, </span>',
			) );
		?>
	</div><!-- .entry-content -->

a na końcu ten kod java script co go wyżej podałem i jeszcze dodatkowo to JQuery, chociaż widzę że i tak jest w WP ale chyba inna wersja ale i tak widzę że jest problem choćby z CSS. Zrzut niżej:

user image

Ale to jest na stałe, zmiana w adminie i tak spowoduje tylko zmianę treści i nic poza tym.

0

Żeby wstawić w środek treści, to musisz sobie zdefiniować shortcode'a w pliku functions.php, a następnie w dowolnym miejscu w treści dodawanej za pomocą panelu użyć tego shortcode'a. Shortcode można traktować, jak funkcję do użytku w normalnym tekście, a wygląda to tak:

Treść, treść, treść, treść, treść, treść, treść [pogoda], treść, treść, treść, treść, treść.

Jak się definiuje te cuda: https://codex.wordpress.org/Shortcode_API

0

tutaj macie garść porad:
http://webinsider.pl/wordpressie-wykonywanie-wlasnego-kodu/
http://wpinternals.pl/programowanie/haki-wordpressa-cz-1-wprowadzenie-do-akcji-i-filtrow/

do tworzenia tylko na jednej podstronie funkcja is_page() np. sprawdzasz ID strony i strona ID 13 to
is_page( 13 )
lub po nazwie
is_page( 'Ale ciekawy temat' )

0

Panowie, napotkałem jeszcze jeden problem... Okazuje się, że tekst publikowany na stronie klienta nie jest zwyczajnie wklepywany jako tekst. Jest tam zainstalowany jakiś plugin/wtyczka o nazwie: "Visual Composer". Nie ma tam praktycznie żadnego kodu, nie wiem jak w ogóle dojść do źródłowego kodu HTML, żeby móc wprowadzić mój kod w środek jego kodu. Dodałem oczywiście mój kod i śmiga - dodałem to za pośrednictwem tego shortcoda. Tyle tylko, że mój kod mogę wrzucić albo przed jego kodem HTML albo po jego kodzie HTML. Nie wiem jak to dodać w środek, tam gdzie on chce, żeby to było tak jak on chce.
Miał ktoś z tym do czynienia i jest w stanie mi pomóc w tej sytuacji?

0

Ale jakoś tekst wpisuje, a shortcode jest zwykłym tekstem, nie znacznikiem HTML, więc powinno go normalnie interpretować.

0

No to tłumaczę, że pogoda wyświetla się normalnie, ale nie tam gdzie chcę.

Mam dwa znaczniki:

[costam][pogoda]

I jak widać, pogoda może wskoczyć albo przed jego tekst albo za jego tekst. Ja chcę to wrzucić w środek. Nigdzie nie mogę znaleźć w plikach (przez ten plugin visual composer) tego kodu HTML, żebym sobie tam mógł tą moją pogodę dokoptować.

0

Chyba czegoś nie rozumiem. A gdzie konkretnie teraz wpisujesz tego shortcode'a? W jakimś konkretnym pliku motywu?

0

Tak, w functions.php

0

W functions.php powinna być definicja tego ustrojstwa, a sam shortcode wpisujesz w tekst, tam gdzie chcesz wyświetlić wynik jego działania, zobacz na poniższe przykładowe rysunki (na podst. przykładu zaczerpniętego z Kodeksu).

To powinno być w pliku functions.php

//[foobar]
function foobar_func( $atts ){
	return "foo and bar";
}
add_shortcode( 'foobar', 'foobar_func' );

Teraz tak zdefiniowanego shortcode'a wstawiam do tekstu:
48e7964a47.png

A tak to wygląda na stronie:
19a02b5861.png

0

Wiem jak to wstawić w tekst bo już to wyświetliłem, tylko nie w tym miejscu gdzie chcę. Tego "ustrojstwa" nie ma w functions.php, zamiast tego są jakieś inne pliki i funkcje, zaczynające się od "visual...", ale tam nic nie widzę, jedynie same gołe funkcje, które obrabiają ten tekst i wyświetlają na stronie, ale samego kodu HTML nigdzie nie mogę dorwać.

0

Bo w pliku functions.php nie ma nic być, sam musisz sobie definicję wpisać. Żaden kod HTML nie jest ci do tej operacji potrzebny.

0

Kilka razy zdarzało mi się przerabiać coś dla klienta na gotowych szablonach, gdzie cała treść była stworzona przez Visual Composer i też był problem jak umieścić coś stworzonego w php w konkretnym miejscu. Pewnie nie jest to najlepsze rozwiązanie, ale zwykle robiłem tak, że w footer, umieszczałem sobie jakiś html w warunku wyświetlającym kod dla podstrony o danym id

<div class="do-ukrycia-wywalenia">
<?php if( is_page(249) ) { ?>
    <div id="frankenstein">
          html Lorem ipsum
    </div>
<?php } ?>
</div>

potem w js / jquery klonowałem cały div, wklejałem go sobie gdzieś (append / prepend / html) i usuwałem, ewentualnie wywalałem ten tymczasowy kontener z footer.

var klon = $('#frankenstein').clone();
$('#jakis-div-na-stronie').html(klon);
$('.do-ukrycia-wywalenia').remove();

1 użytkowników online, w tym zalogowanych: 0, gości: 1