1. Raccolta di Plugins per Webdesigner e Skinner
    [Risorse ] Raccolta redatta dallo SF sui componenti aggiuntivi dei browsers che sono stati recensiti.

    Avatar
    Tags
    Plugin
    Resource
    By .|Ye|. il 25 June 2013
    +6   +1   -1    0 Comments   1,044 Views
    .
    Raccolta aggiornata e download di tutti i componenti aggiuntivi dei browser recensiti dallo Skinfactory.

    1. Colorzilla
    Permette di giocare con le "tempere" mentre siete nel vostro browser preferito, che non dovrebbe essere Internet Explorer né tantomeno Opera e Safari :-)
    Recensione: Il dinosauro multicolorato
    Download per: Firefox - Chrome


    2. MeasureIt
    Permette di misurare porzioni di pagine web, a mò di righello portatile.
    Recensione: Misurarlo e scannerizzarlo!
    Download per: Firefox - Chrome


    3. LinkChecker
    Scannerizza i link presenti in una pagina web.
    Recensione: Misurarlo e scannerizzarlo!
    Download per: Firefox - Chrome


    4. IE Tab
    Converte le pagine di Mozilla/Chrome in pagine Internet Explorer.
    Recensione: Il potere asiatico
    Download per: Firefox - ...

    Read the whole post...

    Last Post by .|Ye|. il 25 June 2013
    .
  2. Set Menù(x2) + Sidebar - Hanami Collection

    +3   +1   -1    8 Comments   391 Views
    .


    ANTEPRIMA



    Set di due menù e una sidebar coordinati da usare dove volete. Possono essere usati tutti insieme o separatamente.
    Per problemi o errori scrivere qui.

    Se prelevate un menù, sarebbe gradito l'inserimento dei crediti:
    CODICE
    Menù realizzato da <a href="http://skinfactory.forumfree.it/?act=Profile&MID=2266120">Valls</a> ~ <a href="http://skinfactory.forumfree.it">Skin Factory</a>


    POTETE:
    ☺ Modificare i colori e i font;
    ☺ Cambiare l'immagine, i testi e le voci e aggiungerne altre.

    SCONSIGLIATO:
    - Aggiungere voci nella sidebar o mettere immagini di dimensioni diverse da quelle consigliate.

    VIETATO:
    ✖ Stravolgere l'aspetto di menù o sidebar perchè non sono basi;
    ✖ Spacciarli per propri;
    ✖ Togliere i crediti alla sidebar. Si tratta di una scritta di 9px per nulla invadente, per favore lasciatela.

    Read the whole post...

    Last Post by phoebe’ il 21 Nov. 2013
    .
  3. Set Menù(x2) + Sidebar - Nature Collection

    +5   +1   -1    17 Comments   907 Views
    .


    ANTEPRIMA



    Set di due menù e una sidebar coordinati da usare dove volete. Possono essere usati tutti insieme o separatamente.
    Per problemi scrivere qui.

    Se prelevate un menù, sarebbe gradito l'inserimento dei crediti:
    CODICE
    Menù realizzato da <a href="http://skinfactory.forumfree.it/?act=Profile&MID=2266120">Valls</a> ~ <a href="http://skinfactory.forumfree.it">Skin Factory</a>


    POTETE:
    ☺ Modificare i colori e i font;
    ☺ Cambiare l'immagine, i testi e le voci e aggiungerne altre.

    SCONSIGLIATO:
    - Aggiungere voci nella sidebar o mettere immagini di dimensioni diverse da quelle consigliate.

    VIETATO:
    ✖ Stravolgere l'aspetto di menù o sidebar perchè non sono basi;
    ✖ Spacciarli per propri;
    ✖ Togliere i crediti alla sidebar. Si tratta di una scritta di 9px per nulla invadente, per favore lasciatela.


    MENU 1 - CODICE

    Da aggiungere in Colori e Stili:

    CODICE
    /* MENU 01 - Nature collection */
    .valls02 li {font: 20px 'grand hotel';
    background: #91DB30;
    line-height: 60px;
    text-align:center;
    margin: 2px;
    padding: 0 4px;
    border-radius: 80px;
    min-height: 50px;
    min-width: 50px;
    transition:all .1s ease-in-out}
    .valls02 li a {color: #FFF;
    text-decoration: none;
    border: 3px solid #FFF;
    box-shadow: 1px 2px 2px #777;
    padding: 5px;
    background: #D87E2F;
    text-align:center}
    .valls02 li:nth-child(even) {background: #D87E2F}
    .valls02 li:nth-child(even) a {background: #91DB30}
    .valls02 li:hover {transform:rotate(10deg); -webkit-transform:rotate(10deg)}


    Da aggiungere in HTML in cima a tutte le pagine:

    CODICE
    <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Grand+Hotel">


    Da aggiungere in HTML dove volete:

    ...

    Read the whole post...

    Last Post by -spiker il 6 Mar. 2014
    .
  4. Menu a Rombo #1

    Tags
    Menu Pronto
    Resource
    By -spiker il 25 Aug. 2013
    +3   +1   -1    3 Comments   110 Views
    .

    tagmr1
    Esempio

    Premessa: il menu è stato realizzato dalla sottoscritta pertanto è gradito l'inserimento dei credits proposti. Giusto giusto perchè ho fatto la base che voi modificherete per adattarla alle vostre esigenze :).
    CODICE
    Menu a Rombo by <a href="http://evs.blogfree.net/?act=Profile&MID=24527">-spiker</a>


    Il codice è molto intuitivo per chi conosce un minimo di CSS/HTML, ma se avete problemi potete contattarmi tramite la sezione "Supporto" aprendo un topic.

    In Amministrazione > Grafica > Colori e Stili:
    CODICE
    /* MENU ROMBO BY -spiker */
    .evs {width: 70px; height: 70px;
    background: #FF4B4B;
    display: inline-block;
    margin: 15px;
    transform: rotate(45deg); -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); transition-duration: .3s; -webkit-transition-duration:.3s; -moz-transition-duration: .3s; -o-transition-duration: .3s}
    .evs:hover {background: #1DB9C4}
    .evs_text, .evs_text a {height: 70px;
    color: #FFF;
    padding: 3px;
    line-height: 60px;
    text-decoration: none;
    transform: rotate(-45deg); -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -o-transform: rotate(-45deg)}
    .evs_text:hover, .evs_text a:hover, .evs:hover a {color: #FFF}
    .evs:hover, .evs_text:hover {transform: rotate(0deg); transform: rotate(0deg); -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); transition-duration: .3s; -webkit-transition-duration:.3s; -moz-transition-duration: .3s; -o-transition-duration: .3s}

    /* MENU ROMBO - VOCE PERSONALIZZATA  BY -spiker */
    .evs_1 {width: 70px; height: 70px;
    background: #1DB9C4;
    display: inline-block;
    margin...

    Read the whole post...

    Last Post by -spiker il 26 Aug. 2013
    .
  5. Il potere asiatico
    [ Articolo - Web - Plugin ] Recensione IE Tab

    Avatar
    Tags
    Articolo
    Plugin
    Web
    By .|Ye|. il 24 Aug. 2013
    +1   +1   -1    1 Comments   832 Views
    .

    ietab


    La teoria sensata di Ye sulle origini del nome...


    L'origine di questo nome deriva praticamente da 工作值得一個真正的中國鋸狐狸轉換火災和鉻的“河馬滅絕”(簡稱IE瀏覽器)。Ovvero una cosa tipo 工作值得一个真正的中国锯狐狸转换火灾和铬的“河马灭绝”(简称IE浏览器)。Che in sostanza vuol dire che converte volpi di fuoco e cromo per creare ippopotami estinti. La cosa buffa è che questo plugin difficilissimo da realizzare è stato fatto da un medico dal nome sconosciuto (e forse perchè impronunciabile) durante una pausa caffè in una clinica del Taiwan, al posto di scaccolarsi il naso. Questo fatto bizzarro può essere infatti spiegato solo in un modo: ASIATICI.



    Un po' di sana SìCiclopedia.

    IE Tab è un plugin sviluppato da due cinesi. Il nome degli sviluppatori è sconosciuto, ma uno di loro lavora come medico in una clinica del Taiwan e gestisce un blog sotto il nome di PCMan. Questo plugin ha una sola funzione importante che consiste nel vedere Internet Explorer direttamente su Firefox e Chrome.

    Le sue opzioni sono le seguenti:
    - Visualizza la pagina con IE Tab che permette di vedere la pagina corrente di Firefox o Chrome come se fosse Internet Explorer.
    - Visualizza la pagina in un programma esterno (x) che permette di vedere la pagina su un altro programma (browser) a scelta.
    - nelle opzioni del componente aggiuntivo è possibile settare dei filtri per alcuni siti, il programma a scelta con cui si desidera aprire le pagine e altre opzioni varie come la possibilità di aggiungere le icone al menu contestuale (che sarebbero le voci che si ottengono quando si clicca con il destro sulla pagina web)

    Giudizio finale

    Utile per chi odia talmente tanto internet explorer da averlo disinstallato/cancellato/istinto dal pc (say goodbye to ie...) ma che, per questioni di lavoro et similia, ha bisogno comunque di utilizzarlo. Anche la funzione che apre la...

    Read the whole post...

    Last Post by Valls ~ il 25 Aug. 2013
    .
  6. Link - Raccolta di risorse per skinners
    [ Resource - Web ]

  7. Menu a Cerchio Orizzontale #1

    Tags
    Menu Pronto
    Resource
    By -spiker il 17 Aug. 2013
    +1   +1   -1    0 Comments   97 Views
    .

    tagmco1
    Esempio

    Premessa: il menu è stato realizzato dalla sottoscritta pertanto è gradito l'inserimento dei credits proposti. Giusto giusto perchè ho fatto la base che voi modificherete per adattarla alle vostre esigenze :).
    CODICE
    Menu a Cerchio by <a href="http://evs.blogfree.net/?act=Profile&MID=24527">-spiker</a>


    Il codice è molto intuitivo per chi conosce un minimo di CSS/HTML, ma se avete problemi potete contattarmi tramite la sezione "Supporto" aprendo un topic.

    In Amministrazione > Grafica > Colori e Stili:
    CODICE
    /* MENU A CERCHI ORIZZANTILI BY -spiker */

    .circlevs {display: inline-block;
    width: 65px;
    height: 65px;
    text-align: center;
    margin: 4px;
    border-radius: 50px;
    line-height: 60px;
    padding: 2px;
    background: #FF4B4B;
    color: #FFF}

    .circlevs:hover {background: #1DB9C4;
    transition-duration: .99s;
    -webkit-transition-duration:.99s;
    -moz-transition-duration: .99s;
    -o-transition-duration: .99s;
    transform: scale(1.5) rotate(360deg);
    -moz-transform: scale(1.5) rotate(360deg);
    -webkit-transform: scale(1.5) rotate(360deg);
    -o-transform: scale(1.5) rotate(360deg)}

    In Amministrazione > Grafica > Gestione HTML (dove volete il menu, alto, basso, home etc...):
    CODICE
    <a href="#" class="circlevs">Voce #1</a>
    <a href="#" class="circlevs">Voce #2</a>
    <a href="#" class="circlevs">Voce #3</a>
    <a href="#" class="circlevs">Voce #4</a>
    <a href="#" class="circlevs">Voce #5</a>

    Al posto di # dovete aggiungere URL della voce.

    La parte in Colori e Stili serve per personalizzare il menu e come detto il codice è molto intuitivo:
    ...

    Read the whole post...

    Last Post by -spiker il 17 Aug. 2013
    .
  8. Misurarlo e scannerizzarlo!
    [Articolo - Web - Plugin] Recensione MeasureIt e LinkChecker

    Avatar
    Tags
    Articolo
    Plugin
    Web
    By .|Ye|. il 7 July 2013
    +3   +1   -1    4 Comments   756 Views
    .


    La teoria sensata di Ye sulle origini del nome...


    MeasureIt nasce dal perverso pensiero di uno sviluppatore - che diversamente da Rufy cappello di paglia - indossa sempre un cappello leopardato. Avendo infatti la nevrolgica necessità di doversi misurare in continuazione le immagini trovate sui vari twit degli utenti, per dimostrare chi ce lo ha più lungo (il cappello), pensò di creare questo buffo righello che può raggiungere dimensioni impensabili e riportare il tutto con estrema precisione degna del colpo in buca di Tiger Woods.
    LinkChecker è nato principalmente per stalkerare tutte quelle donzelle o quei donzelli di cui si vuole sapere l'indirizzo. In questo modo è possibile minacciare i propri nemici virtuali dicendo loro di sapere dove vivono, o al contrario è possibile chiedere alle proprie amiche virtuali dove vivono per poi - alla loro indignazione - dire loro di saperlo già perché siete dei dannati stalker. Tuttavia in seguito è stato cambiato come semplice convalidatore di indirizzi pubblici.



    Un po' di sana SìCiclopedia.

    Kevin Freitas è lo sviluppatore di due plugin denominati MeasureIt e LinkChecker, che se installati insieme o divisi permettono al browser Mozilla Firefox oppure Chrome, di sfruttare fino a due funzioni che possono rivelarsi utili.

    MeasureIt opacizzerà l'intera pagina web al click del mouse sulla sua icona a forma di righello, presente solitamente a destra della barra di indirizzo e ricerca. In questo particolare stato sarà possibile trascinare il mouse in qualunque punto della pagina per misurarne una porzione qualsiasi. Così facendo sarà facilissimo misurare le dimensioni esatte (in pixel) degli avatar di twitter oppure la largezza/altezza totale (in pixel) della tabella di quel forum che venera il cantante Povia. La pagina opaca serve per permettere di illuminare solo le zone che intendete misurare. Al riclick sull'icona del righello sarà possibile disattivare il tutto in ogni momento.

    LinkChecker non possiede icone aggiuntive nella barra del browser, bensì aggiunge l'opzione Verifica i link di questa pagina nel menu che compare al click destro del mouse sulla pagina web. Questa funzione permette di scannerizzare tutti i link presenti nella pagina e segnalare, sottolineandoli con un colore, se sono validi, invalidi, saltati (skipped) o multipli (misc). È possibile cambiare il colore da asseg...

    Read the whole post...

    Last Post by .|Ye|. il 12 July 2013
    .
  9. Il dinosauro multicolorato
    [ Articolo - Web - Plugin ] Recensione Colorzilla

    Avatar
    Tags
    Articolo
    Plugin
    Web
    By .|Ye|. il 25 June 2013
    +6   +1   -1    5 Comments   292 Views
    .

    colorzilla


    La teoria sensata di Ye sulle origini del nome...


    Tutti quelli che passeranno di qui avranno sicuramente avuto a che fare almeno una volta con ColorZilla o ne avranno sentito parlare da qualche parte. Sopratutto gli amanti dei nyan cat, i dinosauri sfumati che vomitano arcobaleni dopo essersi fatto un clistere e naturalmente (al terzo posto) gli skinner o più in generale i webdesigner professionalmente fumati da tutte quelle sfumature fatte a mano(shop) nell'ormai lontano 2008.
    Ma che cos'è ColorZilla Gradient? Altro non è che un leggendario webdinosauro nato da una sorta di parto fatto tra circa 2010 arcobaleni che hanno dato luce a questo sito archeologico e molto colorito che permette, con veramente pochi click, di creare una sfumatura perfetta in css3 pronta per essere aggiunta al tuo forum in tutte le estensioni impossibili ed inimmaginabili in modo tale da farla funzionare regolarmente in tutti i browser (anche del 2005) tanto che a quel punto ti accorgi di aver finito i caratteri disponibili nel colori e stili per poterne aggiungere un'altra.
    Come per la storia dell'uovo e della gallina questo coloratissimo sito di gradienti ha un figlio, oppure è lui il figlio di suo figlio e il vero padre è un altro colosso conosciuto con il nome di FileZilla, madre di tutti gli arcobaleni (?). Ma questo non ha importanza non c'entrando assolutamente un pastello con suo figlio, piuttosto quello che si presume essere suo figlio (del dinosauro verde che vomita arcobaleni) è il cosidetto plugin-per-i-browser-di-Colorzilla che quest'oggi andrò a recensire per lo Skinfactory!


    Ma intanto un esemplare del temibilissimo dinosauro di Mozilla Firefox, un lontano parente del Colorzilla,
    durante la fase di caccia ;-)




    Un po' di sana SìCiclopedia.

    ColorZilla è ufficialmente un'estensione per Mozilla Firefox e secondariamente per Google Chrome. È stata sviluppata da Alex Sirota, un webdesigner e programmatore, creatore di famosi plugin come anche FoxyTunes e attualmente co-founder della Loop Commerce, un ambizioso gruppo di persone che in questo momento sta lavorando in segreto con il fine di "cambiare l...

    Read the whole post...

    Last Post by Connie il 29 June 2013
    .
  10. Super-Raccolta generatori CSS
    [Resources - CSS]

    Tags
    CSS
    Resource
    By M1ck1 il 29 Aug. 2011
    +1   -1    8 Comments   3,761 Views
    .

    1. CSS3 Generator Sito di qualità semplice con numerose funzioni,

    2. CSS3 Maker Molto simile al precedente, ma più completo e ricco!

    3. Colorzilla CSS Gradient Un avanzatissimo generatore di gradienti molto simile a quello presente nel software "Photoshop". Consente di creare gradienti di diverso tipo, cross-browser e anche di importarne nuovi da un'immagine esistente.

    4. Layer Styles Il nome dice tutto: "Stili di Livello". Una versione pressochè identica degli stili di livello persenti in "Photoshop". Quando non è possibile ritagliare un'immagine con ombra o simili questo è il tool a cui fare riferimento.

    5. CSS Border Radius Un semplice tool che ci consente di realizzare angoli arrotondati, se non avete voglia di scrivere ogni volta il codice diverso per ogni browser questo è il sito che fa per voi. Adesso su forumfree non è necessario scrivere le varie versioni con i prefissi.

    6. CSS Layout Generator Un ottimo generatore che ci può risparmiare tanto lavoro nella realizzazione di un layout base

    7. CSS Menu Generator Un tool utile per i meno esperti che potrebbero avere difficoltà nel realizzare un menu rollover avanzato. Ricco di stili!

    8. CSS Creator Layout Un altro fantastico generatore di layout che ci consente anche di scegliere tra diversi doctype.

    9. CSS Menu Maker Altro tool per creare menu CSS accattivanti.

    10. Only CSS Menu Ennesimo sito per creare ottimi menu CSS.

    11. CSS Gradient Generator Un altro tool per realizzare gradienti con CSS3, non è avanzato come quello di colorzilla ma è molto facile e veloce da usare.

    12. CSS3 playground Generatore di CSS3 molto vario e ricco di funzionalità.

    13. CSS3.me Generator Se secondo voi anche l'occhio vuole la sua parte ecco a voi un generatore con funzioni molto simili a quelli che vi ho mostrato precedentemente ma con un design molto pro!

    14. Style Master...

      Read the whole post...

    Last Post by .|Ye|. il 20 June 2012
    .