Salta ai contenuti. | Salta alla navigazione

Informativa breve
Questo sito si avvale di Cookies necessari al funzionamento ed utili alle finalità illustrate nella Informativa estesa.
Chiudendo questo banner, si acconsente all’uso dei Cookies.

IPnext Blog

Notizie e riflessioni su Internet e sulle tecnologie IP.

Integrare un blog Wordpress all'interno di un sito.

Una delle domande piu' frequenti sui forum dedicati allo sviluppo per il Web riguarda l'integrazione di un blog all'interno di un sito esistente, all'interno di un pannello o un box sulla pagina principale. Come vedremo da questo breve tutorial, e' una cosa abbastanza semplice da fare.

Cominciamo!

Per questo tutorial usero' il nostro blog aziendale, quello su cui state leggendo questo articolo, e lo integrero' all'interno di un sito statico che ho scaricato da OSWD, una directory da cui si possono scaricare template gratuiti con licenza Creative Commons. Per l'occasione usero' il piu' popolare, ovvero RedTie di alexisc22.

Installo i file di RedTie, una pagina HTML (index.html), un foglio di stile (style.css) e qualche immagine, nella cartella "test" all'interno del mio blog.

 

L'ho messa li' per comodita', ma in un ambiente di produzione sarebbe sicuramente meglio separare il sito e il blog in cartelle diverse. L'importante e' che la cartella del blog, e i suoi file header, siano accessibili e includibili all'interno del file del sito, come andremo a vedere tra pochissimo. Quello che vogliamo e' un simpatico box che ci mostri gli ultimi 3 articoli pubblicati sul blog, comprensivi di titolo, data, permalink e un breve estratto del testo. Questo box prendera' il posto dell'attuale riquadro "News", in basso a sinistra. Mi sembra il posto ideale dove inserirlo.

 

Includiamo i file di header di Wordpress

Apriamo il file index.html del sito nel nostro editor preferito. All'inizio del file, ancora prima della dichiarazione del DOCTYPE, inseriamo il codice PHP seguente:

<?php // richiama gli ultimi 3 articoli dal nostro blog. define('WP_USE_THEMES', false); // ignora il tema di Wordpress require('../wp-blog-header.php'); // include il file di header del blog Wordpress $query= 'showposts=3'; // vogliamo solamente gli ultimi 3 articoli query_posts($query); // ok, vai e colpisci! ?>

Benissimo. Abbiamo creato un piccolo script che andra' a prendere gli articoli del nostro blog, secondo l'unico criterio: prendi gli ultimi tre. Ora dobbiamo specificare dove vogliamo inserirli.

Editiamo il box.

Sempre in index.html, scendiamo di qualche riga fino a incontrare il box prescelto.

<div id="leftpanel"> <div align="justify" class="graypanel"> <span class="smalltitle">News</span><br /><br /> <span class="smallredtext">September 27, 2006</span><br /> <span class="bodytext">Curabitur arcu tellus, suscipit in, aliquam eget, ultricies id, sapien. Nam est.</span><br /> <a href="#" class="smallgraytext">More...</a><br /><br /> <span class="smallredtext">September 27, 2006</span><br /> <span class="bodytext">Curabitur arcu tellus, suscipit in, aliquam eget, ultricies id, sapien. Nam est.</span><br /> <a href="#" class="smallgraytext">More...</a><br /><br /> <span class="smallredtext">September 27, 2006</span><br /> <span class="bodytext">Curabitur arcu tellus, suscipit in, aliquam eget, ultricies id, sapien. Nam est.</span><br /> <a href="#" class="smallgraytext">More...</a><br /><br /> </div> </div>

Questo box contiene nel suo div interno di classe "graypanel", tre elementi ripetuti. Quello che vogliamo fare e' creare un piccolo loop che partendo dai dati che abbiamo appena raccolto, generi il testo che vogliamo ben tre volte, ovvero per ciascun articolo recuperato. Iniziamo a togliere gli elementi ridondanti.

<div id="leftpanel"> <div align="justify" class="graypanel"> <span class="smalltitle">Blog</span><br /><br /> <!-- Qui ho modificato il titolo del box --> <span class="smallredtext">Titolo</span><br /> <!-- Qui ho un inserito un <span /> per il titolo dell'articolo --> <span class="smallredtext">Data, Autore</span><br /> <!-- Qui ho aggiunto uno spazio per l'autore del blog--> <span class="bodytext">Estratto del testo</span><br /> <!-- Qui ci finira' l'estratto delll'articolo --> <a href="Link" class="smallgraytext">Leggi tutto...</a><br /><br /> <!-- Ho modificato il testo; ci andra' il permalink --> <!-- Qui ho rimosso gli elementi ripetuti --> </div> </div>

Ora ho il codice ripulito e pronto a ospitare i template tags di Wordpress. Cosa sono? Sono dei piccoli alias che richiamano un elemento specifico dell'articolo di un blog. In Wordpress, un articolo e' composto da un Titolo, una Data di pubblicazione, di un Permalink, il Testo, etc... Tutte queste informazioni, una volta raccolte dallo script che abbiamo inserito in cima alla pagina, sono disponibili per inserimento nella pagina grazie a dei comodissimi codici, chiamati da Wordpress template tags. A questa pagina troviamo l'elenco completo dei tags. Sosituiamo questi tags al testo che abbiamo inserito:

<div id="leftpanel"> <div align="justify" class="graypanel"> <span class="smalltitle">Blog</span><br /><br /> <!-- Il titolo del box e' statico e non deve essere ripetuto --> <?php // L'inizio del Loop che scrivera' il seguente per ogni articolo recuperato (3). while (have_posts()): the_post(); // "finche' abbiamo post da pubblicare, prendi il prossimo post e scrivi il seguente...?> <span class="smallredtext"><?php the_title(); ?></span><br /> <span><strong><?php the_date(); ?>, <?php the_author(); ?></strong></span><br /> <span class="bodytext"><?php the_excerpt(); ?></span><br /> <a href="<?php the_permalink(); ?>" class="smallgraytext">Leggi...</a><br /><br /> <?php endwhile; // Fine del Loop. Ovvero "ripeti fino a qui".?> </div> </div>

Salvate il file e apritelo nel vostro browser! Ecco il risultato:

Integrare un blog Wordpress all'interno di un sito.

Potete scaricare il sorgente modificato di index.html cliccando qui


IPnext - Chi Siamo

IPnext - Cosa facciamo

IPnext - Contattaci

Azioni sul documento

Installing Plone 4.0 via buildout on Centos 5

The Right Way™ to install Plone is by using buildout, the Python building tool. This brief tutorial will assist you in this task, starting from a freshly installed Centos 5 box.

Create a Zope user

We will create a user named 'zope'.

adduser zope -d /home/zope -m -p mypassword

This will create a zope user and the relative home directory.

Install the package dependencies

Centos provides Python 2.4, but we need Python 2.6. We will compile this version of the Python language from source. First of all we need some development files:

yum install readline-devel zlib-devel curses-devel libjpeg-devel freetype-devel libxml2-devel libxslt-devel

We will also need the subversion client and the GCC, if not already present:

yum install subversion gcc

I also use Git as a version control client. Skip this part if you don't want it.

rpm -Uvh http://download.fedora.redhat.com/pub/epel/5/x86_64/epel-release-5-3.noarch.rpm
yum install git

Install Python

Become the zope user:

su - zope

Create a working directory:

mkdir -p work/python/src && cd work/python/src

Get the latest Python sources:

wget http://python.org/ftp/python/2.6.6/Python-2.6.6.tgz

Cd right in and compile the sources:

./configure --prefix=/home/zope/work/python --with-zlib=/usr/include \
--with-readline=/usr/include --with-curses=/usr/include && make && make install

Python should compile for a while and then install itself in the directory we specified as "prefix". It's time to move on and install some useful Python tools...

Cd inside our src directory:

cd /home/zope/work/python/src

Get the sources of SetupTools (also known as easy-install)

wget http://pypi.python.org/packages/source/s/setuptools/setuptools-0.6c11.tar.gz

Untar it and cd inside its source directory; now install it:

/home/zope/work/python/bin/python2.6 setup.py install

The egg will now be correctly installed inside our custom Python site-packages directory. Now we'll use easy-install to get virtualenv:

/home/zope/work/python/bin/easy_install virtualenv

Still with me? Let's create the virtualenv environment for our Plone 4 installation. This will separate things cleanly and greatly help us manage the various instances of Plone, Zope and Python.

/home/zope/work/python/bin/virtualenv ../../plone-env2.6

This will create a virtualenv environment in /home/zope/work/ named "plone-env2.6". Let's activate it with:

source /home/zope/work/plone-env2.6/bin/activate

Cd inside the relevant directory:

cd /home/zope/work/plone-env2.6/

Let's get the remaining tools we need to be fully operational as a Plone developer:

pip install PasteScript ZopeSkel

Great! We now got paster, a great tool we will be using a lot! Paster creates templates of just about everything; from Plone buildout instances to custom content. Let's use it to create a mint Plone 4 buildout instance

paster create -t plone3_buildout plone4

Paster will ask some questions about what to create. We're okay with using "easy" mode so just hit enter. When asked about the Plone version, type in "4.0.1"; leave the default on all the other questions and just type the password you want for the Plone superuser. This will generate the folder "plone4"; cd into it.

Install PIL(woTk)

We will use a special package of PIL, the Python Imaging Library, known as PILwoTk. Open the file buildout.cfg (our buildout configuration file) in your favourite editor (for example, Vim) and add the following:

[buildout]
find-links =
    (...)
    http://dist.plone.org/thirdparty/PILwoTk-1.1.6.4.tar.gz
eggs=
     (...)
     PILwoTk

Install Zope and Plone

Bootstrap your Plone instance:

python bootstrap.py

Now run buildout with the following command:

bin/buildout -vvv

Buildout will now download, compile and install all the necessary dependencies. This may take some time, so it's time to make some microwave popcorn to chomp on... mmmmm.... Once it has finished, you can type the following to launch your Plone instance:

bin/instance fg

Plone (Zope, actually) will launch in debug mode; we do this just to check everything is ok. You might get some warnings, but ignore them for now; what we're looking for is something like this:

INFO Zope Ready to handle requests

This means that you can launch your browser and type "http://127.0.0.1:8080" to access your Plone instance. Well done, you have successfully installed Plone with buildout! Thanks to didakus for some pointing out some errors.

Azioni sul documento