Nuovo Webepc.it e tema Customizr

[glm2006ITALY]

Salve a tutti!

Sto aggiornando graficamente a qualcosa di più moderno (e responsive) il mio webepc.it

Sto usando questo thema
https://demo.themesandco.com


Ho (per ora) 4 problemi:
A) il colore del "cerchio" delle pagine "in evidenza" sono riuscito a cambiarlo correttamente tramite child theme ma riducendo la schermata nella visualizzazione da tablet / smartphone torna di colore bianco!
Ho provato a guardare ul codice ma non mi pare che vari

B) Sto cercando di inserire nel footer il mio copyright con il nome e le indicazioni varie... sarò rincretinito ma non ne esco!

Codice:

[== PHP ==]
     * Footer Credits call back functions         * Can be filtered using the $site_credits, $tc_credits parameters         *         *         * @package Customizr         * @since Customizr 3.0.6         */        function tc_colophon_center_block() {            echo apply_filters(                'tc_credits_display',                sprintf('<div class="%1$s">%2$s</div>',                    apply_filters( 'tc_colophon_center_block_class', 'span4 credits' ),                    sprintf( '<p>%1$s %2$s</p>',                            apply_filters( 'tc_copyright_link', sprintf( '&middot; &copy; %1$s <a href="%2$s" title="%3$s" rel="bookmark">%3$s</a>', esc_attr( date( 'Y' ) ), esc_url( home_url() ), esc_attr( get_bloginfo() ) ) ),                            apply_filters( 'tc_credit_link', sprintf( '&middot; Designed by %1$s &middot;', '<a href="'.TC_WEBSITE.'">Themes &amp; Co</a>' ) )                    )                )            );        }

        /**        * Displays the back to top fixed text block in the colophon        *        *        * @package Customizr        * @since Customizr 3.0.10        */        function tc_colophon_right_block() {            echo apply_filters(                'tc_colophon_right_block',                sprintf('<div class="%1$s"><p class="pull-right"><a class="back-to-top" href="#">%2$s</a></p></div>',                    apply_filters( 'tc_colophon_right_block_class', 'span4 backtop' ),                    __( 'Back to top' , 'customizr' )                )            );        }

        /**        * Displays the back to top on scroll        * Has to be enabled in the customizer        *        * @package Customizr        * @since Customizr 3.2.0        */        function tc_render_back_to_top() {            if ( 0 == esc_attr( tc__f( '__get_option' , 'tc_show_back_to_top' ) ) )                return;            printf( '<div class="tc-btt-wrapper"><i class="btt-arrow" style="color:%1$s"></i></div>',                TC_utils::$instance -> tc_get_skin_color()            );        }

        /**        * Displays the widget icons if option is enabled in customizer        * @uses filter tc_footer_widget_wrapper_class        *        * @package Customizr        * @since Customizr 3.2.0        */        function tc_set_widget_wrapper_class( $_original_classes ) {            $_no_icons_classes = array_merge($_original_classes, array('no-widget-icons'));
            if ( 1 == esc_attr( tc__f( '__get_option' , 'tc_show_footer_widget_icon' ) ) )                return ( 0 == esc_attr( tc__f( '__get_option' , 'tc_show_title_icon' ) ) ) ? $_no_icons_classes : $_original_classes;             //last condition              return $_no_icons_classes;        }    }//end of classendif;

C) Nell'editor "lato admin" non vedevo il testo perchè appariva chiaro su chiaro.
Ho dovuto impostare un colore scuro (già questo mi pare anomalo) ... nel precedente tema potevo impostare "di default" delle colonne.

Con questo non è possibile e vorrei usare un plugin.
Ho provato Advanced WP Columns
Funzionare funziona ma.... non riesco a vedere le colonne!

D) la grafica che vedete mi piace header, slider, footer, pagina in evidenza ma convince meno il "centro pagina"....
Come potrei inserire la sidebar dentro un riquadro come in questo sito:
https://www.goservice.com.pt (usa lo stesso tema)

Grazie a tutti per le risposte

[glm2006ITALY]

Per il colore ho risolto...

Il codice colore da cambiare era nascosto nel file blue.min.css...

[Jack]

A) Le versioni responsive per cellulare hanno spesso (non sempre) un css separato. Ti consiglio comunque di usare un editor come Notepad+ oppure Grepwin portable per cercare direttamente dentro al testo dei file. Leggi il codice e poi cerchi il testo col programma.

B) Ad occhio è molto probabile che possa gestire le variabili con una widget o con le impostazioni del tema. "Designed by" lo puoi modificare. Puoi anche togliere quel "Themes [...]" mentre quell © è il simbolo di copyright, quindi ciò che segue lo puoi decidere tu (al momento è una variabile presa da qualche parte nel codice, la puoi cancellare e mettere del testo puro, se proprio non sai dove è validata).

C) Non ho capito bene.... Nella sezione personalizza non ci sono queste impostazioni? Cambiare un paio di css cmq non dovrebbe essere complesso usando il sistema della lettera A. Eviterei di eccedere coi plugin, sono causa di falle pericolose e di rallentamento del sito e del server, fai sempre un test col google speed checker.

D) Ho provato a dare un'occhiata al codice sul sito portoghese ma non è semplice non potendo vedere il tuo. In ogni caso, hai provato ad aggiungere due bei "border-top:1em solid black; border-bottom: 1em solid black;" alla classe "slide" ?

ps: tutte queste modifiche le puoi fare anche per mezzo di un child theme, in modo da non toccare il codice originale, se hai paura di non sapere tutto tutto.

ps2: più bello comunque, non c'è dubbio, sempre sul nero però... io mi schiarirei un po' (almeno questo suggeriscono i manuali di marketing)

J

[glm2006ITALY]

[JACK]oops per errore invece di rispondere ho modificato il tuo post! se ricordi quello che manca rimodificalo pure [/JACK]

Riguardo all'© lo sapevo, ma solitamente quel genere di codice è "incassato" dentro dell'html... in questo caso no...

Per il "punto C".... solitamente anche se il tema è scuro con testo chiaro nella gestione della pagine si ha SEMPRE sfondo bianco e testo nero... in questo caso no!

Se impostavo da tema child un colore del testo chiaro me lo richiama anche lato amministrazione :/
Per il "D" se vedi nello screenshot che ho allegato la sidebar è praticamente solo divisa da una barretta bianca... vorrei staccarla di più dal fondo in maniera che il tutto sia più carino

[Jack]

solitamente quel genere di codice è "incassato" dentro dell'html... in questo caso no...

E' dell'HTML dentro una funzione (in modo che sia gestibile esternamente) in tutti i temi moderni è così a meno che non vogliano renderti difficile il modificare il footer . E' comunque HTML anche quello (un'entità carattere per essere precisi).

Per il "punto C".... solitamente anche se il tema è scuro con testo chiaro nella gestione della pagine si ha SEMPRE sfondo bianco e testo nero... in questo caso no!
Se impostavo da tema child un colore del testo chiaro me lo richiama anche lato amministrazione :/

Non ho capito nienteee Nelle impostazioni com'è il colore? Se lo cambi che succede? Se usi un tema child non ti tocca l'amministrazione (purché non la coinvolga tu).

Per il "D" se vedi nello screenshot che ho allegato la sidebar è praticamente solo divisa da una barretta bianca... vorrei staccarla di più dal fondo in maniera che il tutto sia più carino

Quella sidebar da quale classe è gestita? Lo chiedo perché nel demo che linki non la vedo... Probabilmente dalla classe footer_three (?). In quel caso basta tentare un padding-bottom. Anche se probabilmente è più armonioso mettere un margin-top nel footer (dove c'è il logo oscon).

J

[glm2006ITALY]

Allora partiamo dal primo "problema"....

L'attuale tema "garage" prevede la possibilità di creare delle "colonne"
https://www.webepc.it/sito-web-per-ristoranti/

Il sito è scuro ma se apro la "gestione" il tutto risulta chiaro:



Ora con il nuovo tema ho inserito nel css del tema child ho inserito:

Codice:

[== CSS ==]
body {
  background: none repeat scroll 0 0 #222428;
  color: #f2f2f2;
  padding-bottom: 0;
}

Così facendo ho ottenuto il testo chiaro di sfondo.

Però se ora apro il pannello di controllo...


Ho dovuto modificare il css presente nella cartella inc/admin/css/editor-style.css (nel tema "base" e NON nel child)

Codice:

[== CSS ==]
body{
    background: #222428!important;
}

Per poter vedere il testo!

Inoltre questo tema non ha la possibilità di inserire delle colonne nativamente per dividere il contenuto delle pagine o articoli... in quel caso cosa posso usare?

Spero che ora sia più chiaro

[Jack]

Allora partiamo dal primo "problema"....

L'attuale tema "garage" prevede la possibilità di creare delle "colonne"
https://www.webepc.it/sito-web-per-ristoranti/

Il sito è scuro ma se apro la "gestione" il tutto risulta chiaro:

Ah, tu stai parlando del modulo di modifica delle pagine interno a Wordpress, è naturale che sia chiaro. Per quello non era molto comprensibile. Quello dipende sempre dallo stile del pannello di amministrazione (che peraltro puoi anche cambiare con plugin o stili). Un conto è il core del sito, un conto è lo stile del template (anche se puoi farli interagire in parte).

Ora con il nuovo tema ho inserito nel css del tema child ho inserito:

Codice:

[== CSS ==]
body {
  background: none repeat scroll 0 0 #222428;
  color: #f2f2f2;
  padding-bottom: 0;
}

Bisognerebbe vedere come hai creato il tema child. Spiega un po'.

In ogni caso puoi banalissimamente inserire nel tema un <div style="background: #222428; color: #f2f2f2;"> dopo il <body> e un </div> subito prima del </body>, già ti risolvi.

Ho dovuto modificare il css presente nella cartella inc/admin/css/editor-style.css (nel tema "base" e NON nel child)

Codice:

[== CSS ==]
body{
    background: #222428!important;
}

No, così non va bene, al primo aggiornamento di wordpress perdi tutto ovviamente. E poi non è il caso di modificare lo style dell'admin quando si può modificare quello del tema (sempre la classe del body).

Probabilmente basta - parlo sempre del tema, mi raccomando - un .home {background: #222428!important;} (con o senza important, a seconda di cosa è definito altrove).
In generale la cosa da individuare è il div che vuoi far diventare scuro. Una volta individuato vedi la classe associata e la modifichi. Altrimenti, se vuoi rendere scuro l'intero background del sito, o usi il body, o usi un div che contenga tutto, come dicevo sopra.

Inoltre questo tema non ha la possibilità di inserire delle colonne nativamente per dividere il contenuto delle pagine o articoli... in quel caso cosa posso usare?

Spero che ora sia più chiaro

No, onestamente questa cosa non la capisco bene. Da dove inserivi le colonne? La pagina di cui c'è lo screenshot sopra è la semplice sezione di gestione delle pagine di Wordpress, non crea colonne... Le colonne di solito si gestiscono via widget o tramite le impostazioni specifiche del tema (se le ha). Altrimenti le puoi aggiungere modificando il codice, ma non credo sia il caso di questo tema, perché da quel poco che vedo mi pare abbastanza "automatizzato".
Prova a fare un copia incolla della pagina di cui hai fatto lo screenshot prima (dall'etitor visuale o dal codice) e inserirla nell'editor di pagine del nuovo sito. Funziona? Il codice qual è?

J

[glm2006ITALY]

Jack il css modificato è del tema non di WP, al massimo lo perdo quando farò l'aggiornamento del tema ^^
Ma è normale che sostituendo il colore del testo "lato visitatore" questo vada a modificarsi anche lato amministrazione?

Con "colonne" non intendo sidebar et simila ma la possibilità d suddividere i contenuti dentro una pagina o un articolo.

[Jack]

Jack il css modificato è del tema non di WP, al massimo lo perdo quando farò l'aggiornamento del tema ^^
Ma è normale che sostituendo il colore del testo "lato visitatore" questo vada a modificarsi anche lato amministrazione?

è normale se modifichi la sezione "admin". E' meno normale se modifichi il normale css. Il css che stai modificando come si chiama?

Con "colonne" non intendo sidebar et simila ma la possibilità d suddividere i contenuti dentro una pagina o un articolo.

Provato a far questo "fare un copia incolla della pagina di cui hai fatto lo screenshot prima (dall'editor visuale o dal codice) e inserirla nell'editor di pagine del nuovo sito. Funziona? Il codice qual è?" .

[glm2006ITALY]

Si chiama style.css!
E' questo che mi ha "spiazzato"...

Questo è il codice (e nel nuovo tema non funziona)

Codice:

[== Non indicato ==]
La WebePc rivolge  particolare attenzione al settore della ristorazione.

Gli italiani, si sa, sono delle "buone forchette" ed anche sul web  una presentazione d'alto livello è fondamentale!
<!--more-->

&nbsp;

&nbsp;

&nbsp;
<h2 style="text-align: center;">Il sito internet che  offriamo  al tuo ristorante è...</h2>
<img class="aligncenter wp-image-868" style="margin-top: 5px; margin-bottom: 5px;" src="https://www.webepc.it/wp-content/uploads/2014/10/ristoranti_web.jpg" alt="creazione siti internet per ristoranti" width="491" height="269" />

&nbsp;
<div class="cols">
<div class="two"><strong><img class="alignleft wp-image-824" style="margin: 5px;" src="https://www.webepc.it/wp-content/uploads/2014/10/dolce.png" alt="ritorante web site" width="70" height="70" /><span style="color: #00ccff;">Accattivante e coinvolgente:</span></strong> la grafica sarà realizzata appositamente per la tua struttura scegliendo assieme colori, impaginazione...</div>
<div class="two"><img class="alignleft wp-image-453" style="margin: 5px;" src="https://www.webepc.it/wp-content/uploads/2013/04/462382191895458110.png" alt="Siti web compatibile dispositivi mobili" width="77" height="77" /><span style="color: #00ccff;"><strong>Responsive:</strong></span> il tuo sito sarà comodamente accessibile da qualsiasi  dispositivo: dal semplice pc di casa allo smartphone ultimo modello!</div>
</div>
&nbsp;
<div class="cols">
<div class="two"><strong>
<img class="alignleft wp-image-828" style="margin: 5px;" src="https://www.webepc.it/wp-content/uploads/2014/10/seo.png" alt="seo" width="70" height="70" /><span style="color: #00ccff;">Ottimizzato SEO:</span></strong> i contenuti, i testi e la struttura verranno ottimizzati per i motori di ricerca al fine di ottenere un posizionamento ottimale.</div>
<div class="two"><span style="color: #00ccff;"><strong><img class="alignleft wp-image-832" style="margin: 5px;" src="https://www.webepc.it/wp-content/uploads/2014/10/menu.png" alt="menu per ristorante online" width="70" height="70" />Semplice da gestire:</strong></span> potrai scegliere se presentare  o meno ai clienti il tuo menù online, gestire eventi, modificare le pagine, aggiungere fotografie: tutto con pochi semplici click!</div>
</div>
&nbsp;
<div class="cols">
<div class="cols">
<div class="two"><img class="alignleft wp-image-834" style="margin: 5px;" src="https://www.webepc.it/wp-content/uploads/2014/10/economico.png" alt="economico" width="70" height="70" /><span style="color: #00ccff;"><strong>Senza costi fissi di abbonamento:</strong></span> nessuna spesa ulteriore dopo l'acquisto, il sito sarà di piena proprietà e non ci sono costi di abbonamento!</div>
<div class="two"><img class="alignleft wp-image-835" style="margin: 5px;" src="https://www.webepc.it/wp-content/uploads/2014/10/Social-network.png" alt="Social network per ristoranti" width="70" height="70" /><span style="color: #00ccff;"><strong>Social!</strong> </span>Collega  il tuo sito web ai più famosi social network, Facebook, Google+, Twitter,ecc. ed espandi il tuo mercato.</div>
</div>
</div>
&nbsp;
<h1 style="text-align: center;"><span style="font-size: medium;">Tutti  i siti web da noi sviluppati, offrono incluso nel prezzo:</span></h1>
<div class="cols">
<div class="two">

<strong><img class="alignleft  wp-image-416" style="margin: 10px;" src="https://www.webepc.it/wp-content/uploads/2013/04/gmaps.png" alt="Google Maps" width="60" height="60" />Integrazione ed inserimento nelle mappe di Google Maps</strong>Tutte le attività che si rivolgono al nostro servizio verranno inserite  in <strong>Google  Maps</strong> e la loro scheda verrà ottimizzata per aumentare la visibilità rispetto ai prorpi concorrenti.

&nbsp;

<img class="alignleft  wp-image-399" style="margin: 10px;" src="https://www.webepc.it/wp-content/uploads/2013/04/guida.png" alt="guida" width="60" height="60" />

<strong>Gui</strong><strong>da di gestione </strong>Con indicazioni passo passo sulla gestione dei testi, fotografie e dei contenuti: in questo modo potrete  aggiornare  autonomamente e senza costi aggiuntivi il vostro sito.

</div>
<div class="two">

<strong><img class="alignleft  wp-image-192" style="margin: 10px;" src="https://www.webepc.it/wp-content/uploads/2013/01/statistiche.png" alt="statistiche" width="60" height="60" />Statistiche</strong>

Grazie al servizio online di statistiche si avrà sempre una completa panoramica sui visitatori e sulla loro provenienza.

&nbsp;

<strong><img class="alignleft  wp-image-166" style="margin: 10px;" src="https://www.webepc.it/wp-content/uploads/2013/01/support.png" alt="support" width="60" height="60" />Assistenza via email, Skipe,Google Talk o Telefono</strong> gratuita per i primi 45 giorni  ed <strong>assistenza gratuita</strong> tramite <a title="Support" href="https://www.webepc.it/assistenzaclient/">ticket service</a> per i primi 90 giorni dalla consegna

</div>
</div>
&nbsp;

<img class="alignleft  wp-image-116" src="https://www.webepc.it/wp-content/uploads/2013/01/chisiamo.png" alt="chisiamo" width="60" height="60" /><strong>l'assistenza post sviluppo</strong>

Una volta completata la realizzazione e messo il cliente finale nelle condizioni di poter fruire liberamente del suo nuovo sito web  delle sue funzioni la WebePc rimane a disposizione in caso di malfunzionamenti o per eventuali modifiche  o consulenze.

&nbsp;

<img class="alignleft wp-image-859" style="margin: 5px;" src="https://www.webepc.it/wp-content/uploads/2014/10/Canon-1D-side-256-150x150.png" alt="servizio fotografico ristoranti" width="60" height="60" /><strong>Servizio fotografico</strong>

Per coloro che lo richiedono possiamo occuparci del servizio  fotografico del vostro ristorante realizzato con apparecchiature professionali.

&nbsp;

&nbsp;
<div class="cols">
<div class="two">

<strong>SCOPRI LA QUALITA' DEL NOSTRO SERVIZIO:</strong><span style="color: #00ccff;"><strong><span style="font-size: medium;"><a title="Feedback" href="https://www.webepc.it/feedback/"><span style="color: #00ccff;"><img class="alignleft wp-image-830 " style="margin: 5px 0px 5px 5px;" src="https://www.webepc.it/wp-content/uploads/2014/10/feedback-300x300.png" alt="feedback" width="158" height="158" /></span></a></span></strong></span>

<span style="color: #00ccff;"><strong><a style="color: #00ccff;" title="Feedback" href="https://www.webepc.it/feedback/">Leggi le opinioni di coloro che ci hanno scelto</a></strong></span>

&nbsp;

<span style="color: #00ccff;"><strong><a style="color: #00ccff;" href="https://www.facebook.com/pages/Web-e-Pc-di-Molina-Gianluca/180739301418?sk=reviews" target="_blank">Leggi  le recensioni  rilasciate su Facebook</a></strong></span>

</div>
<div class="two" style="text-align: center;"><img class="aligncenter size-full wp-image-849" src="https://www.webepc.it/wp-content/uploads/2014/10/ristoranti.png" alt="ristoranti" width="280" height="145" /></div>
<div class="two" style="text-align: center;"><strong>Possiamo  occuparci  dell'inserimento della tua struttura sui più importanti siti web del settore come TripAdvisor, Mangione,DueSpaghi,ecc.</strong></div>
</div>
&nbsp;
<p style="text-align: center;"><a title="Preventivo online sito web" href="https://www.webepc.it/servizi-web/preventivo-sito-web/"><span style="color: #00ccff;"><strong><span style="font-size: 14pt;">Chiedi subito un preventivo, gratuito e senza impegno!</span></strong></span></a></p>
<p style="text-align: center;"><a title="Preventivo online sito web" href="https://www.webepc.it/servizi-web/preventivo-sito-web/"><span style="color: #00ccff;"><strong><span style="font-size: 14pt;">Clicca qui</span></strong></span></a></p>
&nbsp;

Alcuni esempi di<strong> siti  web per ristoranti  </strong>sviluppati:

[gallery ids="770,725,595,610,477,47"]

<center>(clicca per ingrandire)</center>

[glm2006ITALY]

Online!!!

https://www.webepc.it

Ora dovrò risolvere qualche problemino con le traduzioni.

Rimane il problema che il testo nell'interfaccia lato amministrazione nella modifica delle pagine/articoli è chiaro!

Ora che è online riesci a vedere come personalizzare lo sfondo dell'area widget sulla destra?

[Jack]

Rimane il problema che il testo nell'interfaccia lato amministrazione nella modifica delle pagine/articoli è chiaro!

Ma quello è normale, il form è sempre bianco in WP (a meno che non capiti qualche casino nel css)

Ora che è online riesci a vedere come personalizzare lo sfondo dell'area widget sulla destra?

Quale? Di che colore lo vuoi fare? Intanto i link ai profili social li metterei sulla destra che se no sembrano più importanti dei link del menù

[glm2006ITALY]

Ciao Jack, buon anno.

Come ti pare?

Si il form è bianco... il problema che il testo NON è di colore nero

Per l'area widget presente nella colonna di destra mi piacerebbe riuscire ad "imitare" una cosa tipo https://www.goservice.com.pt

[Jack]

Eccomi. Me lo devo ancora guardare bene (come sai si è segretissimamente dietro il contratto in questi giorni).

Una cosa che mi aveva colpito e che avrei cambiato è il fatto che i due menu, quello stabile e quello flottante, sono molto simili ma un po' diversi. Io credo che li farei o uguali, o completamente diversi, altrimenti c'è una strana sensazione quando si vede uno dei menu scendere giù "un pochino diverso" da quello che c'era prima Tra l'altro quello grigio chiaro ha i link in grigio scuro poco leggibili (vedi https://www.paciellogroup.com/resources/...tanalyser/).

Ho visto che vari che hanno usato quel template fanno così in effetti.

Lo sto guardando con varie risoluzioni, in particolare col netbook che mi porto in giro per la città, e il menu che va a capo è un po strano (la parola "assistenza" è spostata sulla destra rispetto a "home"). Come dicevo sopra sposterei a float:right le icone sociali (ma potrebbe influire sul responsivo, da testare).

Il resto mi pare ok, anche il widget che volevi cambiare mi pare piuttosto armonico col colore scuro del sito.

Per il prossimo anno vojo un bel nuovo logo eh, questo è un po' stile anni 80. ps: lo slogan è Internet and computer solution ma direi che dovrebbe essere plurale a meno che non ti riferisca a "la soluzione" (42).

J

[glm2006ITALY]

Si il menù è fatto così: imho a me piace

Le icone teoricamente non si possono spostare.... però il menù si può impostare right o left.

Per l'area widget mi pare troppo armonico... sbaglio?

Per il logo.... nel 2016?
Primo devo far fuori i 400 biglietti che mi rimangono con il vecchio ahahah

[glm2006ITALY]

Risolto il problema del colore del testo "lato amministrazione"

Però contemporaneamente me ne apparso un altro...

Eliminando "color: #f7f7f7;"

Ottengo esattamente quello che volevo dal lato amministrativo ma purtroppo ... mi cambia anche colore del sito lato utente!

Codice:

[== CSS ==]
body {
  background: none repeat scroll 0 0 #222428;
  color: #f7f7f7;
  padding-bottom: 0;
}