PERCHE‘ WOOCOMMERCE/WORDPRESS E’ LENTO

Cache, Server e Codice sono quelli che maggiormente vanno ad aumentare il tempo di caricamento delle pagine rendendo il sito poco fruibile e lento.

Qui sotto vi spiego in dettaglio tutte le cause che possono portare ad un rallentamento del sito.

 

DIMINUIRE IL PESO DELLE IMMAGINI DI WORDPRESS

Una buona gestione dell’aspetto visual, ossia delle immagini, permette di ridurre i tempi e i problemi legati alla performance del sito web. Soprattutto nei siti di grandi dimensioni è fondamentale gestire e ottimizzare al meglio questo aspetto, al punto tale che si riuscirà ad avere un risultato migliorato dell’80%.

Ottimizzare le immagini significa, di fatto, fare economia a proposito del loro peso: dunque, il primo consiglio è quello di ridurre al minimo il numero di foto, video, grafici e infografiche, da aggiungere solo nel caso in cui siano veramente necessari.
Nel caso in cui le immagini siano necessari, come nei blog di cucina o di viaggi, è importante impegnarsi affinché la pagina non si appesantisca troppo: è dunque buona norma scegliere il formato che meglio si adatta alle esigenze del sito web, evitando di inserire immagini compresse o di bassa qualità che penalizzerebbero l’esperienza dell’utente.

OTTIMIZZAZIONE DEL CODICE, DEL TEMA E DEI PLUGINS

I template che acquistate, sopratutto quelli di theme forest, sono molto belli graficamente ma sono pesanti a livello di codice, a parte casi saltuari, theme forest è un marketplace per vendere temi e plugins in modo massivo, quindi gli sviluppatori non si preoccupano molto di ottimizzare il codice e di scriverlo bene. Tramite un’attenta analisi si può, però, migliorare anche i temi più pesanti.

LA SCELTA DEL SERVIZIO DI HOSTING PROVIDER

Si sente spesso parlare di tempo di risposta del server in relazione al tempo che trascorre dal momento in cui il client richiede l’accesso ad una pagina e quello in cui il server lo concede. Questa tempistica è influenzata da due diversi aspetti, il funzionamento del server stesso e il grado di ottimizzazione del sito web che deve essere caricato. A proposito del server è giusto puntualizzare che non si tratta di qualcosa che possiamo direttamente controllare o gestire, poiché occuparsi di ciò è compito del proprio provider di web hosting.

Ci si può però occupare della scelta di un veloce hosting, prestando attenzione alle performance che promette di offrire sia nei luoghi che sono dotati di data center, sia di quelli che non lo posseggono.
I fornitori di web hosting rappresentano, di fatto, un buon aiuto per velocizzare la crescita del proprio sito web ed è per questo che scegliere quello giusto per le proprie esigenze rappresenta un elemento fondamentale. È importante trovare il giusto equilibrio tra il prezzo che si vuole spendere e le prestazioni che si vogliono ottenere.

SFRUTTARE LA CACHE PER RENDERE PIU’ VELOCE WOOCOMMERCE

Un sistema di cache immagazzina in una cartella di WordPress le pagine che gli utenti del sito internet visitano, così che quando vengono visitate di nuovo, anche da utenti diversi, il sito non dovrà più interrogare il database per visualizzare la pagina, ma la prenderà direttamente dalla cartella in cui è salvata, metodo che riduce notevolmente il tempo di caricamento delle pagine.

Esistono 2 tipi di cache, uno viene installato su server, può essere per esempio Redis o MemCached; l’altro viene installato come plugin di WordPress.

Che cos’è un tema child WordPress e come crearlo

 

un Tema child WordPress, di cosa stiamo parlando ?

ti sei mai trovato nella situazione di aver aggiornato il tema e tutte le tue modifiche sono andate perse ? No ? beh sono contentissimo purtroppo a me tantissimo tempo fa è capitato e ho dovuto rifare tutto da capo o ho preso i file di backup (ora non ricordo come ne sono uscito vincitore)

Creare un tema child, ci permette di modificare e/o aggiungere funzionalità al tuo tema (parent) senza dover sovrascrivere alcun file, andando a salvaguardare i nostri lavori durante la fase di aggiornamento.

Quando dobbiamo creare un tema child WordPress?

beh la risposta è semplice, bisogna sempre creare un tema child WordPress i motivi quali sono :

  • se dobbiamo lavorare sui file del tema.
  • se stiamo dando un progetto a un nostro cliente/committente bisogna attenerci sempre ai standard, sia se in futuro ci riandremo a lavorare sia se lasceremo il progetto a dei nostri collaboratori.
  • se stiamo lavorando in Team, per permettere a tutti noi di evitare errori.

Come si crea un tema child WordPress?

Andiamo nella cartella wp-content/themes, e creiamo una cartella che avrà come nomenclatura il nome del tema (parent) + la string ‘-child’, esempio se dobbiamo creare un tema child per il famoso tema Enfold andremo a generare una cartella “enfold-child”.

successivamente andremo nella cartella appena generata e creeremo un file style.css  che conterrà il seguente codice:

/*
 Theme Name: Enfold Child
 Theme URI: #nogo
 Description: Enfold Child Theme
 Author: Il tuo nome e cognome
 Author URI: https://example.com/
 Template: enfold
 Version: 1.0.0
 Tags: tag che possono essere applicati al tuo tema separati da virgola
 Text Domain: enfold-child
*/

successivamente creeremo un file denominato function.php e al suo interno andremo a scrivere il seguente codice:

<?php
 add_action( ‘wp_enqueue_scripts’, ‘enfold_child’ );
 function enfold_child’ () {
    wp_enqueue_style( ‘enfold-child-style’, get_template_directory_uri() . ‘/style.css’ );

 }
?>

bene ora basterà andare nella sezione aspetto -> tema e attivare il nostro theme child appena creato.

Iniziamo dalla soluzione 😎

function aeroporti_custom_post() {
  // creo e registro il custom post type
  register_post_type( 'aeroporto', /* nome del custom post type */
    // definisco le varie etichette da mostrare nei menù
    array('labels' => 
        array(
          'name' => 'aeroporti', /* nome, al plurale, dell'etichetta del post type. */
          'singular_name' => 'aeroporto', /* nome, al singolare, dell'etichetta del post type. */
          'all_items' => 'Tutti gli aeroporti', /* testo nei menu che indica tutti i contenuti del post type */
          'add_new' => 'Aggiungi nuovo', /*testo del pulsante Aggiungi. */
          'add_new_item' => 'Aggiungi nuovo aeroporto', /* testo per il pulsante Aggiungi nuovo post type */
          'edit_item' => 'Modifica aeroporto', /*  testo modifica */
          'new_item' => 'Nuovo aeroporto', /* testo nuovo oggetto */
          'view_item' => 'Visualizza aeroporto', /* testo per visualizzare */
          'search_items' => 'Cerca aeroporto', /* testo per la ricerca*/
          'not_found' =>  'Nessun aeroporto trovato', /* testo se non trova nulla */
          'not_found_in_trash' => 'Nessun aeroporto trovato nel cestino', /* testo se non trova nulla nel cestino */
          'parent_item_colon' => ''
        ), /* fine dell'array delle etichette del menu */
        'description' => 'Lista aeroporti', /* descrizione del post type */
        'public' => true, /* definisce se il post type sia visibile sia da front-end che da back-end */
        'publicly_queryable' => true, /* definisce se possono essere fatte query da front-end */
        'exclude_from_search' => false, /* esclude (false) il post type dai risultati di ricerca */
        'show_ui' => true, /* definisce se deve essere visualizzata l'interfaccia di default nel pannello di amministrazione */
        'query_var' => true,
        'menu_position' => 8, /* definisce l'ordine in cui comparire nel menù di amministrazione a sinistra */
        'menu_icon' => get_stylesheet_directory_uri() . '/img/mia-icona.png', /* imposta l'icona da usare nel menù per il posty type */
        'rewrite'   => array( 'slug' => 'aeroporti', 'with_front' => false ), /* specificare uno slug per leURL */
        'has_archive' => true, /* definisci se abilitare la generazione di un archivio (tipo archive-aeroporto.php) */
        'capability_type' => 'post', /* definisci se si comporterà come un post o come una pagina */
        'hierarchical' => false, /* definisci se potranno essere definiti elementi padri di altri */

        /* la riga successiva definisce quali elementi verranno visualizzati nella schermata di creazione del post */

        'supports' => array( 'title', 'editor', 'author', 'thumbnail', 'excerpt', 'trackbacks', 'custom-fields', 'comments', 'revisions', 'sticky')
    ) /* fine delle opzioni */
  ); /* fine della registrazione */
}

// Inizializzo la funzione
add_action( 'init', 'aeroporti_custom_post');

Cosa sono i Custom Post Type (CPT) ?

i custom post type o meglio definiti CPT sono dei tipi di post, vengono storicizzati nella classica tabella wp_posts; di default WORDPRESS ne ha 2 le pagine e gli articoli, ma grazie alla funzione sopra elencata ne possiamo aggiungere a nostro piacimento a seconda del progetto da realizzare.

Dove va inserito il codice sopra riportato, che serve alla creazione di un Custom Post Type in WordPress ?

Il codice inserito nel file functions.php del nostro template, o io consiglio sempre di creare un plugin per WordPress e includere il nostro script al suo interno per separare la logica dal tema.

Come aggiungere le categorie ad un CPT (Custom Post Type) WordPress

Di default i custom post type non hanno il supporto per la categorizzazione, nel caso in cui volessimo aggiungerlo possiamo farlo in questo modo:

add_action( 'init', 'category_aeroporto' );
function category_aeroporto() {
  register_taxonomy_for_object_type( 'category', 'aeroporto' );
}

e ora per mostrarli ai nostri utenti ?

Bene, abbiamo creato la parte relativa al back end, una volta che abbiamo inserito i nostri aeroporti, possiamo passare al front end in modo da mostrare i post inseriti.

Adesso all’interno del nostro tema creiamo un file che chiamiamo aeroporto.php (il nome del file deve essere quello del custom post type) e ci incolliamo il codice sottostante.

Come mostrare i post di un custom post type di WordPress

<?php
  /*
  Template Name:  aeroporto
  */
?>

<?php get_header(); ?>    

<?php 
  // Loop aeroporti  
  $custom_query_args = array(
    'post_type' => 'aeroporto',
    'posts_per_page' => 1,
    'orderby' => 'menu_order',
    'order' => 'ASC',
  );
  $custom_query = new WP_Query( $custom_query_args );
?>
<?php if ( $custom_query->have_posts() ) : while ( $custom_query->have_posts() ) : $custom_query->the_post(); ?>
  <article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> 
    <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
    <?php the_post_thumbnail(); ?>
    <?php the_excerpt();?>
  </article>
<?php endwhile; endif; wp_reset_postdata(); ?>

<?php get_sidebar(); ?>               

<?php get_footer(); ?>

 

Se pensate di non riuscire a realizzare queste modifiche o avete bisogno di fare altre personalizzazioni potete contattarmi per una consulenza, se la mole di lavoro è tanta possiamo concordare insieme una formula per un Contratto di assistenza e manutenzione sito web, per il periodo necessario a soddisfare tutte le vostre richieste.

 

Contact Form 7, Come reindirizzare l’utente alla thank you page ?

Nelle versioni precedenti di Contact Form 7, bastava inserire questa dicitura :

on_sent_ok: "location = 'http://www.yourdomain.com/thank-you/';" nella Tab "Additiona Setting"

Come potete notare dall’immagine sottostante, purtroppo con le ultime versioni è stato deprecato questo hook.

e quindi, Come reindirizzare l’utente alla thank you page ?

basta inserire questo codice o nell’header o nel footer del vostro thema, consigliamo di usare sempre un theme child.

<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
 var location = '';
 switch(event.detail.contactFormId) {
  case '#contactFormId':
  location = 'http://www.yourdomain.com/thank-you/';
  break;
 }
}
</scrit>

Per essere + puliti e seguire le regole di wordpress e del codex vi consiglio di inserire questo codice nel file function.php:

add_action( 'wp_footer', 'mycustom_wp_footer' );

function mycustom_wp_footer() {
?>
<script type="text/javascript">
document.addEventListener( 'wpcf7mailsent', function( event ) {
  var location = ''; 
  switch(event.detail.contactFormId) { 
    case '#contactFormId': 
    location = 'http://www.yourdomain.com/thank-you/'; 
    break;
  }
}, false );
</script>
<?php
}

Se pensate di non riuscire a realizzare queste modifiche o avete bisogno di fare altre personalizzazioni potete contattarmi come programmatore wordpress freelance o se la mole di lavoro è tanta concordare insieme per un Contratto di assistenza e manutenzione sito web, per il periodo necessario a soddisfare tutte le vostre richieste

WORDPRESS-WP_db-ESTRARRE-INSERIRE-MODIFICARE-ED-ELIMINARE

WORDPRESS-WP_db-ESTRARRE-INSERIRE-MODIFICARE-ED-ELIMINARE

WORDPRESS WP_DB ESTRARRE, INSERIRE, MODIFICARE  ED ELIMINARE

Impariamo a interagire con il nostro database, collegato aal nostro CMS WordPress.

Estrarre dei dati

facciamo dei piccoli esempi di estrazione dei dati, incominciamo con l’estrazione dei primi dieci link, salvati nel nostro database:

$myLink = $wpdb->get_row("SELECT * FROM $wpdb->links WHERE link_id = 10");

passiamo ora all’estrazione die primi dieci articoli salvati nella tabella wp_posts:

$myPosts = $wpdb->get_row("SELECT * FROM $wpdb->postss WHERE link_id = 10");

ora estraiamo i primi 5 articoli in bozza dell’utente con ID = 5

$fivesdrafts = $wpdb->get_results(
	"
	SELECT ID, post_title
	FROM $wpdb->posts
	WHERE post_status = 'draft'
		AND post_author = 5
	"
);

foreach ( $fivesdrafts as $fivesdraft )
{
	echo $fivesdraft->post_title;
}

Inserimento dei dati

Creiamo un post e andiamo a inserire solo de valori titolo e contenuto (attenzione per rendere il post attivo bisogna compilare almeno i campi di default obbligatori da wordpress, il codice sottostante è puramente un esempio):

$wpdb->insert(
	'wp_posts',
	array(
		'post_title' => 'title',
		'post_comtent' => 'content'
	),
	array(
		'%s',
		'%s'
	)
);
$wpdb->update(
	'tabella',
	array(
		'colonna1' => 'valore1',	// stringa
		'colonna2' => 'valore2'	// intero (numero)
	),
	array( 'ID' => 1 ),
	array(
		'%s',	// valore1
		'%d'	// valore2
	),
	array( '%d' )
);

Aggiornamento dei dati

Aggiornauna riga, dove l’ID è 1, il valore della prima colonna è una stringa ed il valore della seconda colonna è un numero:

$wpdb->update(
	'tabella',
	array(
		'colonna1' => 'valore1',	// stringa
		'colonna2' => 'valore2'	// intero (numero)
	),
	array( 'ID' => 1 ),
	array(
		'%s',	// valore1
		'%d'	// valore2
	),
	array( '%d' )
);

Eliminiamo dati nel nostro database

eliminiamo un record con ID = 1 in una determinata tabella

$wpdb->delete( 'tabella', array( 'ID' => 1 ) );
WordPress wp_query, interagire con i nostri articoli o pagine

wordpress wp_query, interagire con i nostri post

WP_Query è una classe definita in wp-includes/query.php che gestisce le complesse operazioni di richieste di articoli (o pagine) di un blog WordPress; Ci permette di interagire con i dati salvati nel nostro database, possiamo visualizzare, inserire, modificare o eliminare qualsiasi dato presente nel nostro database MySQL.

Interagire con WP_Query

esempio classico di utilizzo della nostra classe wp_query, vediamo come estrarre post di una determinata categoria, poniamo per esempio che vogliamo tirarci fuori i post della categoria con ID = 3.

<?php

  $args = array(
           'cat' => '3'
          );
  // La Query
  $the_query = new WP_Query( $args );

  // Il Loop
  while ( $the_query->have_posts() ) :
	$the_query->the_post();
	echo '<li>' . get_the_title() . '</li>';
  endwhile;

  // Ripristina Query & Post Data originali
  wp_reset_query();
  wp_reset_postdata();
?>

bene abbiamo i nostri post categorizzati, non sto qui a dirvi che possiamo passare tantissimi criteri di ricerca al nostro oggetto $wp_query, vi lascio il documento ufficiale dove poter vedere parametri e metodi che io attualmente non vi ho elencato.

come-creare-una-sideba-e-aggiungerla-al-nostro-tema-wordpress
come-creare-una-sideba-e-aggiungerla-al-nostro-tema-wordpress

 

Creare e aggiungere una sidebar al proprio tema wordpress

Fondamentalmente la sidebar è semplicemente un contenitore, il suo scopo è quello di collocare e far visualizzare i widget, possiamo fondamentalmente creare sidebar in qualsiasi parte del nostro tema wordpress, andiamo a vedere con quale semplicità.

Step1 aprire il file function.php e aggiungere quanto segue:

register_sidebar(array(
	'name' => __( 'Sidebar CUSTOM', 'twentyten' ),
	'id' => 'sidebar-custom',
	'description' => __( 'Sidebar CUSTOM: sidebar aggiuntiva', 'twentyten' ),
	'before_widget' => '<li id="%1$s" class="widget-container %2$s">',
	'after_widget' => '</li>',
	'before_title' => '<h3 class="widget-title">',
	'after_title' => '</h3>',
));

A questo punto nel pannello dei widget, troverete la nuova sidebar.

aggiungere-una-nuova-sidebar

 

Step 2: richiamare nel tema la sidebar. Aprite il file sidebar.php e aggiungete la seguente riga:

<?php dynamic_sidebar('Sidebar CUSTOM'); ?>