Oggi, impareremo come configurare un sito web che può essere facilmente modificato tramite il tuo iPhone e l'app mobile Pagelime. Se non hai familiarità con Pagelime, è un CMS incredibilmente facile da usare che rende il processo di modifica di un sito Web il più semplice possibile.
Nozioni di base su Pagelime
Pagelime è unico in quanto consente di progettare e codificare il sito Web in formato HTML e aggiungere i tag CSS modificabili di Pagelime come ultimo passaggio del processo. Una volta terminato il tuo sito, puoi visitare il sito e aggiungere "class = CMS-modificabile"e un ID univoco per qualsiasi elemento nel tuo codice HTML che desideri sia modificabile. Pagelime si prende cura di tutto il resto.
Una situazione di esempio
Per questo articolo, io sono te? e tu sei forse un web designer che realizza siti web per aziende locali, studi legali, ristoranti, ecc. Così realizzo molti siti di brochure con una pagina di 6-7 ben disegnati.
Quindi stavo organizzando un ristorante per il loro business sul web, e ho scaricato un bellissimo template da ThemeForest con il titolo incredibilmente descrittivo di "Restaurant Website 01". E 'successo così tanto per avere tutto ciò che il nostro cliente stava cercando.
Ho deciso di usare Pagelime perché il mio cliente non apporta molte modifiche drastiche, ma quando lo fa (chiamiamolo Chef Tony) vuole essere in grado di farlo da solo. Diciamo che ero in competizione con alcuni altri sviluppatori per il contratto, e ho venduto Tony per essere in grado di aggiornare la sua ricetta del mese, il suo dipendente del mese e una foto del piatto Paella quotidiana dal suo iPhone. Inutile dire che Tony è rimasto colpito. Tony è raramente colpito; quindi ora dobbiamo rispettare le promesse di aggiornamento della Paella!
Scavando!
Sulla home page del nostro modello, possiamo vedere che ci sono alcune aree sulla pagina che ho bisogno di rendere modificabili. Poiché rendere le cose modificabili con l'app mobile Pagelime non è diverso da quello con l'app web di Pagelime, andiamo ad aggiungere le classi modificabili alle diverse parti a cui siamo interessati.
Ecco il markup per il messaggio di benvenuto.
Benvenuti sul nostro sito web
Si siedono i dolori di Lorem ipsum?
Faremo il p tag modificabile con Pagelime. Poiché utilizziamo l'app per dispositivi mobili, forniremo anche un titolo descrittivo.
Si siedono i dolori di Lorem ipsum?
Ecco la prossima sezione:
Dipendente del mese - Jenny Smith
Gustoso e completo,?
Voglio rendere il titolo, l'immagine promozionale e il contenuto principale stesso modificabile.
Dipendente del mese - Jenny Smith
Gustoso e completo,?
La sezione Ricetta del mese rispecchia esattamente il formato precedente, quindi apportiamo le stesse modifiche a quel blocco di HTML.
Infine rendiamo modificabile l'immagine nell'angolo in alto a sinistra:
Ciò non influisce in alcun modo sul layout del sito e solo su un paio di secondi da codificare. Abbastanza dolce finora! Se apriamo il sito nell'app Web di Pagelime, ora vediamo che tutti i nostri elementi sono modificabili.
Ora ho consegnato la prima versione del sito allo Chef Tony e lui può scaricare l'app mobile di Pagelime qui:
Può accedere con la sua email e la sua password e vedrà il suo sito sul cruscotto:
A questo punto, ha la possibilità di modificare il sito, gestire le immagini, visualizzare i documenti, utilizzare Google Analytics e persino creare nuove pagine e modelli. Ai fini di questo articolo, ci occuperemo solo della modifica del sito e delle immagini.
Cliccando su Modifica sito ti porta al Seleziona pagina schermata in cui Tony può scegliere la home page per la modifica:
La schermata successiva ti fornisce un elenco delle aree modificabili che abbiamo definito in precedenza.
Cliccando su "EOM Headline" ci permetterà di cambiare il dipendente del testo del mese. Tony lo rende lo Chef Tony, perché oggi è riuscito a cucinare una Paella cattiva. Tocchiamo "Fatto", passiamo a "Anteprima" e ora possiamo vedere ora che la sezione "dipendente del mese" è stata, in effetti, aggiornata a "Chef Tony".
Ora aggiorneremo il Immagine di Changer. Per fare ciò, useremo la vista "Modifica". Tocchiamo il pulsante nel subnav che visualizza un'anteprima del sito Web con overlay verdi. Gli overlay ti mostrano cosa è modificabile e puoi toccare per aprire quella regione - simile alla modifica in diretta nell'app Web di Pagelime.
Questo ci dà un'anteprima dell'immagine che stiamo cambiando. Ora abbiamo la possibilità di scattare una foto live al volo, scegliere un'immagine dal nostro telefono o scegliere un'immagine memorizzata nel gestore immagini di Pagelime. Per questo tutorial, scattare una foto di una Paella e quindi utilizzare lo strumento di ritaglio automatico, che ci consente di ridimensionare e ritagliare proporzionalmente la nostra immagine in modo che corrisponda alle dimensioni dell'immagine modificabile sul sito.
Ora possiamo controllare l'anteprima e vedere come appare prima di fare clic su pubblica?
Quando controlliamo il sito web attuale?
? vediamo che tutto è stato aggiornato - tutto dal nostro telefono! Non è necessaria una vera conoscenza tecnica e hai un bel po 'di caramelle client per aiutare a far crescere i tuoi clienti e guadagnare di più. (Non diremo a Tony che si è dimenticato di aggiornare la sua foto del Dipendente del mese.)
Ecco qua: un sito web integrato con un CMS con l'ulteriore vantaggio dell'iPhone - al volo - aggiornamento! Vai a fare un bicchiere di Limeade, goditi l'aria primaverile e l'odore di tutto il verde extra che farai.
Share
Accentsconagua
