http___menet.me_wordpress-petlja-loop__1.xml
1.1 2.1 2.2 2.3 3.1 3.2 3.3 3.4 3.5 3.6 4.1 5.1 6.1 7.1 7.2 8.1 9.1 10.1 11.1 12.1 12.2 13.1 13.2 14.1 15.1 16.1 16.2 17.1 18.1 19.1 19.2 20.1 21.1 21.2 22.1 22.2 22.3 22.4 23.1 23.2 24.1 25.1 26.1 27.1 27.2 28.1 29.1 29.2 29.3 29.4 30.1 30.2 31.1 32.1 33.1 34.1 34.2 34.3 34.4 34.5 35.1 35.2 36.1 36.2 37.1 38.1 39.1 39.2 39.3 40.1 40.2 41.1 42.1 42.2 42.3 42.4
Making your WordPress Plugin Responsive by using AJAX Traditionally whenever you click a link on a web page it might do a request on the server for that URL and the complete page will be fetched from the server. This is fine in some cases but in some cases it is too time consuming for the whole page to load. There might not be much difference in the content of the page as many sections like the header, footer; sidebars might just be the same. You can make your websites more responsive by using AJAX (Asynchronous JavaScript and XML). By using AJAX in your website and plugins you will not refresh the complete page. You will just get the content from the server which you want to update and only update that part of the page. So the complete reload of the pages does not remain necessary and you website seems much more responsive to the user. WordPress also has good support for AJAX. This makes it very easy to write plugins which use AJAX in them. In this article we are going to see how to use AJAX in your plugin by writing a simple plugin which list the latest posts titles and then by clicking on the post title will fetch the contents of the post via an AJAX call. Adding the necessary files and scripts Let’s start by creating the plugin and adding some necessary scripts which will be necessary for our plugin to function. First create a directory ajaxloadpost in you plugins directory of WordPress installation. In it create ajaxloadpost.php with the following content for the header of your plugin. <?php /* Plugin Name: Ajax Load Post Description: This loads post via ajax Author: Abbas Suterwala Version: 1 */ Now you should be able to see your plugin in the plugin list, you should go and activate it. Once you have activated the plugin you should also add the following code to your ajaxloadpost.php define('AJAXLOADPOSTURL', WP_PLUGIN_URL."/".dirname( plugin_basename( __FILE__ ) ) ); function ajaxloadpost_enqueuescripts() { wp_enqueue_script('ajaxloadpost', AJAXLOADPOSTURL.'/js/ajaxloadpost.js', array('jquery')); wp_localize_script( 'ajaxloadpost', 'ajaxloadpostajax', array( 'ajaxurl' => admin_url( 'admin-ajax.php' ) ) ); } add_action('wp_enqueue_scripts', ajaxloadpost_enqueuescripts); In the above code we first we define a variable AJAXLOADPOSTURL which holds the URL to our plugin directory. We will use it wherever we need to point to the URL of our plugin. Then we add the function ajaxloadpost_enqueuescripts too the wp_enqueue_scripts action of WordPress. This will help us enqueue the necessary scripts. First we add our JavaScript file ajaxloadpost.js which should be in \wp-content\plugins\ajaxloadpost\js\ folder. So now you should create the js folder and put the ajaxloadpost.js file in it. The WordPress function wp_enqueue_script will enqueue this script for us and it also specifies that jquery is the prerequisite for this. Then we add a JavaScript variable using the WordPress function wp_localize_script which holds the WordPress AJAX URL which we get using the function admin_url( ‘admin-ajax.php’ ) ). So finally you directory structure will be as follows and your scripts will be enqueued by WordPress. Adding the AJAX handler in WordPress Now let’s write our AJAX handler which will be the function which will handle when we make an AJAX call to WordPress. The code for our AJAX handler is as follows. function ajaxloadpost_ajaxhandler() { if ( !wp_verify_nonce( $_POST['nonce'], "ajaxloadpost_nonce")) { exit("Wrong nonce"); } $results = ''; $content_post = get_post($_POST['postid']); $results = $content_post->post_content; die($results); } add_action( 'wp_ajax_nopriv_ajaxloadpost_ajaxhandler', 'ajaxloadpost_ajaxhandler' ); add_action( 'wp_ajax_ajaxloadpost_ajaxhandler', 'ajaxloadpost_ajaxhandler' ); The above function assumes two inputs to it. One is the post id of the post whose content we want to fetch and second is the ‘nonce’ (this we will discuss in a separate section below). This function first checks if the nonce is appropriate. Once that is done it gets its gets the posted from the $_POST variable. The using the WordPress API get_post we get the post via the post id and gets its content. And then we die by passing the contents back. Once we have got our AJAX handler function in place now we need to register it with WordPress so that our function can be called once we make an AJAX request for it. We can do it by adding our function to the following actions. add_action( 'wp_ajax_nopriv_ajaxloadpost_ajaxhandler', 'ajaxloadpost_ajaxhandler' ); add_action( 'wp_ajax_ajaxloadpost_ajaxhandler', 'ajaxloadpost_ajaxhandler' ); So now when an AJAX request is done to WordPress’s admin-ajax.php url with the action parameter as ajaxloadpost_ajaxhandler our function will be called. The Javascript for AJAX Now let’s write the JavaScript function which will make the AJAX call for us and update the data which is returned by our AJAX handler. The function should be put in ajaxloadpost.js and is as follows. function ajaxloadpost_loadpost(postid,nonce) { jQuery.ajax({ type: 'POST', url: ajaxloadpostajax.ajaxurl, data: { action: 'ajaxloadpost_ajaxhandler', postid: postid, nonce: nonce }, success: function(data, textStatus, XMLHttpRequest) { var loadpostresult = '#loadpostresult'; jQuery(loadpostresult).html(''); jQuery(loadpostresult).append(data); }, error: function(MLHttpRequest, textStatus, errorThrown) { alert(errorThrown); } }); } This function takes two inputs the post id and the nonce. Then using the jQuery.ajax function we will make the AJAX call to the server. The URL is the WordPress AJAX URL of admin-ajax.php which we had stored in the JavaScript variable when enququing the scripts. Then we specify the action as the name of the action handler we registered with WordPress and post the post id and nonce. In case of success we update the   of id #loadpostresult with the content returned by the AJAX handler. In case of error we just pop up the error. Displaying the list of posts Once we have put all these functions in place now let’s display the post title and then depending on the post which is clicked lets fetch the content for it with an AJAX call. The code to do this as follows. function ajaxloadpost_show_latest_posts($number = '5'){ $results =''; $the_query = new WP_Query( 'posts_per_page='.$number ); while ( $the_query->have_posts() ) : $the_query->the_post(); $nonce = wp_create_nonce("ajaxloadpost_nonce"); $arguments = get_the_ID().",'".$nonce."'"; $link = '  '. get_the_title().' '; $result.= ' ' . $link . ' '; endwhile; wp_reset_postdata(); $result.= '  '; return $result; } function ajaxloadpost_shortcode_function( $atts ){ return ajaxloadpost_show_latest_posts(); } add_shortcode( 'AJAXLOADPOST', 'ajaxloadpost_shortcode_function' ); In the function ajaxloadpost_show_latest_posts I do a query to get the latest post and loop over them to put all the titles in an   tag which call our JavaScript function ajaxloadpost_loadpost passing it the post id and nonce. It also adds an empty   which will be filled with the result from the AJAX handler. I have also created a shortcode so that we can use it in a page. In case all is gone well you can add a shortcode [AJAXLOADPOST] in a page as see the post as follows. Now clicking on the hello world post will fetch the content of it as follows. A note on nonces Nonces are basically used to check if the request is come from a genuine source. We generate the nonce using the WordPress function wp_create_nonce. Then this nonce is checked in our AJAX handler using the WordPress function wp_verify_nonce. This is really important in case you are doing some sensitive task in your AJAX handler. You should always check nonces in your AJAX handler. Conclusion AJAX when used appropriately can make your site really responsive to use. WordPress makes it easy by receiving the AJAX call and passing it to our handler. We can easily write our logic and fetch the data which we want to return back to be updated on the front end. So have fun in using AJAX in your next plugin.
1.1 1.2 2.1 3.1 3.2 4.1 4.2 5.1 6.1 6.2 6.3 6.4 7.1 7.2 7.3 8.1 9.1 14.1 14.2 14.3 16.1 17.1 17.2 17.3 17.4 17.5 17.6 18.1 19.1 19.2 19.3 19.4 19.5 19.6 21.1 22.1 26.1 26.2 26.3 26.4 27.1 27.2 28.1 29.1 29.2 29.3 29.4 31.1 32.1 37.1 37.2 37.3 37.4 37.5 37.6 37.7 37.8 37.9 37.10 38.1 39.1 39.2 39.3 39.4 39.5 41.1 42.1 43.1 44.1 45.1 48.1 49.1 50.1 51.1 53.1 53.2 53.3 53.4 53.5 54.1 55.1 55.2 55.3 55.4 56.1
Ako planirate da se ozbiljnije upoznajete sa Wordpresom, najvažnije je da se ne upetljate. Zato ćemo vas danas upoznati sa WordPress petljom – The Loop. Zašto WordPress petlja? WordPress u sebi sadrži mnoge funkcionalnosti kao što su teme, tagovi, pluginovi i slično, ali je WP petlja kičma WordPressa. Koristeći petlju možemo postaviti bilo koji sadržaj na naš sajt u kom god obliku to želimo da uradimo. U osnovi, WordPress ima “template tagove” koji provjeravaju da li postoje postovi koje možemo da prikažemo i, ako postoje, onda ih prikazuju. Spisak ovih tagova možete pogledati na ovoj adresi. Šta treba da znate pri korištenju? Morate da znate da je petlja dio vaših template fajlova koji se nalaze u wp-content/themes/ime_teme folderu. To su, na primjer, index.php, page.php, home.php i slično. Da biste shvatili petlju, morate biti svjesni ovih fajlova i nečega što se zove template hijerarhija. U ovom tekstu nećemo pisati o samoj template hijerarhiji, ali ono što treba da znate zbog praćenja ovog članka je da se, na osnovu template hijerarhije i URL-a koji ukucate u browser, vrši MySQL upit čiji se rezultati čuvaju u $wp_query objektu. Šta sve to, ustvari, znači? Ako odemo na stranicu www.primjer.me/blog (primjer naše blog stranice), za petlju će biti spremljeni svi blogpostovi. Ako odemo na www.primjer.me/imestranice, $wp_query objekat će sadržati samo informacije vezane za tu stranicu. Uvod u petlju WP petlja, generalno, ima sledeći oblik: Prva stvar koju treba da znate je da je have_posts() boolean funkcija, što znači da vraća TRUE ili FALSE. Vraća TRUE ako ima nešto da se prikaže (poziva se $wp_query->have_posts() ), a FALSE u svim drugim situacijama. Ako je if ( have_posts() ) vratila TRUE, ulazimo u: Ovdje primjećujemo funkciju the_post() koja će raspakovati sledeći post u $wp_query. Da je $wp_query bio prazan, naša petlja bi ušla u else dio koda koji u našem slučaju samo ispisuje string “Nema postova”. Gore napisana petlja ništa ne prikazuje dok vrti postove. Kada želimo da prikažemo neki podatak vezan za trenutni post korisniku, moramo koristiti Template tagove. Recimo, koristeći: the_title(), the_time() i the_content(), mogli bi prikazati naslov posta, vrijeme objavljivanja i sadržaj posta. Spisak svih tagova možete naći na ovoj adresi. Treba reći da većina tagova koja započinje na the_ ima pandane kojima je započinju na get_the_ koji se razlikuju od prvih samo po tome što ne prikazuju automatski podatke. Mijenjanje petlje Šta da radimo ako želimo da prikažemo neke stvari na našoj stranici koje se ne nalaze u $wp_query objektu? Recimo da želimo sa strane svakog blog posta postaviti linkove ka pet najnovijih ili najčitanijih blog postova. Postoji nekoliko načina da se ovaj problem riješi od kojih je prvi mijenjanje same petlje. Uzmimo za primjer da želite da na vrhu vašeg bloga postavite link ka najnovijem obavještenju. Pretpostavljam da bi za tako nešto imali posebnu kategoriju koju bi nazvali “obavještenje”. Vaš kod bi tada izgledao slično ovom: query_posts('posts_per_page=1&category_name=obavjestenje '); if ( have_posts() ) : while ( have_posts() ) : the_post(); Vjerujem da ste primijetili da je sam početak već drugačiji od standardne WordPress petlje. Na samom početku se javlja funkcija query_posts() koja dovodi postove u zavisnosti od argumenta. U našem slučaju to je posts_per_page=1, koji određuje da samo jedan najnoviji post treba da bude doveden i category_name=obavjestenje koji postavlja kategoriju iz koje treba uzeti post. Unutar petlje smo postavili samo link ka postu, i nazvali ga po naslovu posta. Važno je biti svjestan toga da query_posts() mijenja podrazumijevanu WordPress petlju i da, kad bi poslije ovoga opet pozvali petlju, ne bi dobili očekivane rezultate. Ovo se rješava tako što po završetku izmijenjene petlje pozivamo wp_reset_query() koji će resetovati upit. Drugi način U posljednjem odjeljku ovog članka, vidjeli ste da smo mijenjali podrazumijevanu petlju. Kako zbog toga može doći do promjene sledećih petlji koje koristimo, treba biti pažljiv pri upotrebi query_posts() funkcije. Zbog toga postoji funkcija get_posts() pomoću koje možemo stvarati više petlji bez mijenjanja podrazumijevane. Pogledajte sledeći primjer: foreach ($posts as $ post) : setup_postdata($post); ?> Ovo je već dosta drugačije od petlji koje smo do sada predstavljali. Razlog tome je što   provjerava da li ima postova i, ako ih ima, prođe kroz svaki. Umjesto toga get_posts() vraća niz postova koje mi čuvamo u promjenljivoj koju sami definišemo (u slučaju prikazanom gore to je promjenljiva $posts). Da bismo prošli kroz ovaj niz, možemo iskoristiti normalnu php foreach petlju. Ali kako stvari sad stoje, ne možemo koristiti template tagove. Zbog toga koristimo funkciju setup_postdata(), koja kao argument mora imati određeni post. Ova funkcija omogućava korištenje template tagova u kontekstu u kojem je postavljena (ovdje u foreach petlji). Jer smo koristili setup_postdata() funkciju, moramo pozvati wp_reset_postdata(), funkcija koja resetuje vrijednost globalne $post promjenljive da bi opet mogli koristiti običnu WP petlju. Nešto slično smo radili i kod query_posts() funkcije, poslije koje smo zvali wp_reset_query() iz istog razloga (wp_reset_query() u sebi čak sadrži poziv za wp_reset_postdata()). U našem primjeru, mi smo za pet postova iz kategorije koja ima id 2 prikazali samo naslov i odječak. WP_Query WP_Query je klasa koja stoji iza svih upita koje smo do sada pominjali. Ako želite da znate malo više o tome šta ova klasa sadrži, možete pogledati wp-includes/query.php gdje je ova klasa definisana. Ovu klasu smo do sada koristili preko $wp_query koji je objekat ove klase. Mi, naravno, možemo i sami da napravimo naš WP_Query objekat. Pogledajte sledeće parče koda: $args = array('cat' => 2); $category_posts = new WP_Query($args); if($category_posts->have_posts()) : while($category_posts->have_posts()) : $category_posts->the_post(); ?> <?php endwhile; wp_reset_postdata(); else: ?> Nema postova!!! Na prvoj liniji koda smo napravili niz argumenata koje ćemo koristiti u našoj petlji. Ovdje samo želimo da uzmemo postove iz kategorije gdje je id 2. Na sledećoj liniji smo napravili novi WP_Query objekat sa željenim argumentima. Provjera postojanja postova i while petlja veoma liče na uobičajenu WordPress petlju, sa tom razlikom što se sve funkcije pozivaju na naš objekat umjesto podrazumijevanog. Kada se izađe iz petlje, poziva se wp_reset_postdata() da bi povratili prvobitnu $post promjenljivu. Savjeti za kraj Ako želite samo da promijenite podrazumijevanu petlju na nekoj vašoj stranici, možete koristiti query_posts(). Ali moj savjet vam je da ovu funkciju izbjegavate. Kada hoćete da dodate neku petlju ili čak više petlji možete, koristiti get_posts() funkciju. Ako vam to nije dovoljno, WP_Query() možete koristiti da promijenite petlju ili napravite više petlji na istoj stranici. Nadam se da smo uspjeli da vam malo približimo WordPress petlju i da vam pokažemo par načina kako iz nje možete dobiti tačno ono što vi želite.