Componente di notifica che mostra la finestra di messaggio di avviso sull'azione dell'utente. Include la transizione di eliminazione animata con icona e pulsante di chiusura.
Codice PHP WordPress + Bootstrap
Esempi di badge Bootstrap con miglioramenti come il colore del badge personalizzato, lo stile del badge del contorno o persino il badge circolare con ombre colorate personalizzate.
Codice PHP WordPress + Bootstrap
Le Bootstrap Card sono costruite con il minor numero possibile di markup e stili, ma riescono comunque a fornire un sacco di controllo e personalizzazione. Costruiti con flexbox, offrono un facile allineamento e si combinano bene con altri componenti Bootstrap. Non hanno margini per impostazione predefinita, quindi usa le utilità di spaziatura secondo necessità.
Card title
Some quick example text to build on the card title and make up the bulk of the card's content.
ScopriCodice HTML Bootstrap
Condividi
Card title
Some quick example text to build on the card title and make up the bulk of the card's content.
Scopri
Codice PHP WordPress + Bootstrap
'post', 'posts_per_page' => 6, 'order' => 'ASC', 'orderby' => 'title' ) ); if ( $rand_posts ) { foreach ( $rand_posts as $post ) : setup_postdata( $post ); ?>
PHP
Un componente per scorrere immagini, video o diapositive di testo, come un carosello.
Codice PHP WordPress + Bootstrap
'post', 'posts_per_page' => 6, 'order' => 'ASC', 'orderby' => 'title' ) ); if ( $rand_posts ) { foreach ( $rand_posts as $post ) : setup_postdata( $post ); ?>;?>)
PHP
Attiva/disattiva le sovrapposizioni contestuali per la visualizzazione di elenchi di collegamenti e altro con il plug-in a discesa Bootstrap.
Codice PHP WordPress + Bootstrap
Usa il plug-in modale JavaScript di Bootstrap per aggiungere finestre di dialogo al tuo sito per lightbox, notifiche utente o contenuti completamente personalizzati.
Codice PHP WordPress + Bootstrap
Crea barre laterali nascoste nel tuo progetto per la navigazione, i carrelli della spesa e altro ancora con alcune classi e il nostro plug-in JavaScript.
Offcanvas
Codice HTML Bootstrap
Link con hrefCondividiOffcanvas
Some text as placeholder. In real life you can have the elements you have chosen. Like, text, images, lists, etc.
Codice PHP WordPress + Bootstrap
/** ** Se utilizzi Bootstrap e hai implementato WP_Bootstrap_Navwalker */ /** ** Copia il codice seguento ed incolla dentro il tag */ 'main-menu', 'container' => '', 'menu_class' => 'navbar-nav ms-auto text-uppercase align-items-md-center', 'fallback_cb' => 'WP_Bootstrap_Navwalker::fallback', 'walker' => new WP_Bootstrap_Navwalker(), ) ); ?>
PHP
Estendi facilmente i controlli dei moduli aggiungendo testo, pulsanti o gruppi di pulsanti su entrambi i lati degli input di testo, selezioni personalizzate e input di file personalizzati.
Codice PHP WordPress + Bootstrap
Bootstrap List Group (gruppi di elenchi) sono un componente flessibile e potente per la visualizzazione di una serie di contenuti. Modificali ed estendili per supportare praticamente qualsiasi contenuto all'interno.
- An active item
- A second item
- A third item
- A fourth item
- And a fifth one
Codice HTML Bootstrap
- An active item
- A second item
- A third item
- A fourth item
- And a fifth one
Codice PHP WordPress + Bootstrap
/*** CATEGORIE WORDPRESS DINAMICHE CON BOOTSTRAP LIST GROUP ****/'name', 'order' => 'ASC') ); $current_category = is_category() ? get_queried_object_id() : false; foreach ( $categories as $category ) { printf( '%s %s', esc_url( get_category_link( $category ) ), selected( $category->term_id, $current_category, false ), esc_html( $category->name ), esc_html( $category->count ), ); } ?>
PHP
Crea etichette modulo meravigliosamente semplici che fluttuano sui campi di input.
Codice PHP WordPress + Bootstrap
Un interruttore ha il markup di una casella di controllo personalizzata ma utilizza la classe .form-switch per eseguire il rendering di un interruttore a levetta. Gli interruttori supportano anche l'attributo disabilitato.
Codice PHP WordPress + Bootstrap
Usa la gamma di input personalizzata per uno stile coerente su più browser e personalizzazione integrata.
Default
Crea controlli personalizzati con .form-range. La traccia (lo sfondo) e il pollice (il valore) hanno entrambi lo stesso stile in tutti i browser. Poiché solo Firefox supporta il "riempimento" della loro traccia dalla sinistra o dalla destra del pollice come mezzo per indicare visivamente i progressi, attualmente non lo supportiamo.
Min and max
Gli input di intervallo hanno valori impliciti per min e max, rispettivamente 0 e 100. È possibile specificare nuovi valori per coloro che utilizzano gli attributi min e max.
Steps
Per impostazione predefinita, l'intervallo inserisce "snap" su valori interi. Per cambiarlo, puoi specificare un valore di passo. Nell'esempio seguente, raddoppiamo il numero di passaggi utilizzando step="0.5".
Codice HTML Bootstrap
CondividiDefault
Crea controlli personalizzati con .form-range. La traccia (lo sfondo) e il pollice (il valore) hanno entrambi lo stesso stile in tutti i browser. Poiché solo Firefox supporta il "riempimento" della loro traccia dalla sinistra o dalla destra del pollice come mezzo per indicare visivamente i progressi, attualmente non lo supportiamo.
Min and max
Gli input di intervallo hanno valori impliciti per min e max, rispettivamente 0 e 100. È possibile specificare nuovi valori per coloro che utilizzano gli attributi min e max.
Steps
Per impostazione predefinita, l'intervallo inserisce "snap" su valori interi. Per cambiarlo, puoi specificare un valore di passo. Nell'esempio seguente, raddoppiamo il numero di passaggi utilizzando step="0.5".
Codice PHP WordPress + Bootstrap
Gli elenchi di dati consentono di creare un gruppo di opzioni a cui è possibile accedere (e completare automaticamente) da un input. Sono simili agli elementi select, ma presentano più limitazioni e differenze di stile del menu. Sebbene la maggior parte dei browser e dei sistemi operativi includa un supporto per gli elementi datalist, il loro stile è nella migliore delle ipotesi incoerente.
Codice PHP WordPress + Bootstrap
/*** *** Con questo form personalizzato suggeriamo all'utente di potere pre-selezionare uno dei corsi presenti nel sito web. Cliccando sul pulsante con icona, verrà reindirizzato nella pagina di ricerca WordPress con il filtro dei post type "Corsi" attivo. ****/
PHP
Costruisci fisarmoniche a collasso verticale in combinazione con il plugin JavaScript Collapse.
.accordion-body, though the transition does limit overflow.
.accordion-body, though the transition does limit overflow.
.accordion-body, though the transition does limit overflow.
Codice HTML Bootstrap
Condividi
This is the first item's accordion body. It is shown by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the.accordion-body, though the transition does limit overflow.
This is the second item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the.accordion-body, though the transition does limit overflow.
This is the third item's accordion body. It is hidden by default, until the collapse plugin adds the appropriate classes that we use to style each element. These classes control the overall appearance, as well as the showing and hiding via CSS transitions. You can modify any of this with custom CSS or overriding our default variables. It's also worth noting that just about any HTML can go within the.accordion-body, though the transition does limit overflow.
Codice PHP WordPress + Bootstrap
Ricerca personalizzata WordPress con Bootstrap
Codice PHP WordPress + Bootstrap
/** ** Ricerca semplice con campo di testo *//** ** Ricerca personalizzata con selezione categoria prodotti Woocommerce */
PHP
