La guida completa di Beaver Builder + Swarmify per l'hosting video
Pubblicato: 2020-11-25Usi Beaver Builder? In tal caso, Swarmify ti aiuta a offrire esperienze video veloci, prive di buffer e professionali sul tuo sito Web senza spendere troppo.
Alimentando oltre un milione di siti Web, Beaver Builder è un popolare generatore di pagine drag and drop tra gli utenti di WordPress.
Il generatore di pagine è incredibilmente facile da usare ma viene fornito con un set unico di funzionalità che lo hanno reso caro sia ai principianti che agli esperti.
Ad esempio, ho ottenuto la seguente pagina in meno di cinque minuti:
È fondamentalmente un modello già pronto che puoi importare in pochi secondi. Quindi, sostituisci le immagini e il testo con i tuoi contenuti e sei pronto e funzionante.
Se non ti piacciono i modelli di Beaver Builder, sei libero di iniziare con una pagina vuota. Quindi trascina e rilascia i blocchi di contenuto in posizione e forgia visivamente il resto della tua pagina senza scrivere HTML o lottare con gli shortcode.
In passato, abbiamo trattato altri page builder come Divi, Elementor, Brizy e Webflow. Si prega di controllare le guide ogni volta che puoi :)
Oggi ti mostriamo esattamente come utilizzare Beaver Builder e Swarmify per offrire esperienze video veloci, senza stallo e professionali sul tuo sito web.
Senza ulteriori indugi, iniziamo poiché c'è molto da imparare.
Cos'è Beaver Builder?
Prima di tutto, impariamo di più su Beaver Builder per il bene del primo timer tra noi.
Beaver Builder è un generatore di pagine WordPress premium. Lo strumento ti aiuta a creare visivamente pagine WordPress reattive.
Ciò significa che crei pagine trascinando e rilasciando blocchi di contenuto. Non è necessaria una precedente esperienza di codifica per utilizzare il generatore di pagine Beaver Builder.
Questa è un'ottima notizia per principianti e professionisti poiché puoi semplificare il flusso di lavoro e risparmiare molto tempo durante la creazione di siti Web.
I più grandi nomi di WordPress amano e si fidano di Beaver Builder:
La parte migliore di Beaver Builder è il fatto che è così straordinariamente facile da usare che creerai siti Web WordPress nel giro di poche ore e non di giorni.
Ed essere facile da usare non significa che Beaver Builder non sia potente come altri page builder. È un robusto generatore di pagine grazie a un ampio elenco di funzioni eleganti.
Caratteristiche, dici?
Sì, Beaver Builder vanta le seguenti funzionalità:
- Design reattivo al 100%, il che significa che le tue pagine avranno un bell'aspetto su più dispositivi
- Beaver Builder Theme Framework per tutti i tuoi progetti WordPress
- Decine di modelli predefiniti per creare landing page, home page, pagine di contenuto, ecc.
- Beaver Builder Drag and Drop page builder
- Una gran quantità di blocchi di contenuto per aggiungere testo, immagini, pulsanti, intestazioni, video, ecc.
- Un sacco di widget WordPress, incluso il widget SmartVideo
- Impostazioni globali
- HTML, CSS e JavaScript personalizzati, se necessario
- Tasti rapidi
- Componente aggiuntivo Beaver Themer per personalizzare ogni parte del tuo sito Web, comprese intestazioni e piè di pagina
- Controllo totale sul design del tuo sito web
- Compatibile con un'ampia gamma di temi WordPress
- Una versione gratuita disponibile come plugin su WordPress.org
- Supporto di livello mondiale
- Capacità multisito
- Etichettatura bianca
- eccetera
Beaver Builder è un potente generatore di pagine che rende la creazione di siti Web WordPress belli e reattivi un gioco da ragazzi. Se è la prima volta, puoi provare la versione gratuita e passare a un piano pro in un secondo momento.
Offrono tre pacchetti di prezzi perfetti per i proprietari di siti per principianti, i liberi professionisti e le agenzie creative. Tutti i pacchetti ti consentono di utilizzare Beaver Builder su un numero illimitato di siti Web.
Ora che siamo tutti sulla stessa pagina, passiamo allo SmartVideo di Swarmify.
Cos'è Swarmify SmartVideo?
Swarmify è una società di accelerazione video focalizzata sul portare lo streaming di qualità Netflix a tutti in un semplice pacchetto. La nostra piattaforma SmartVideo semplifica tutte le parti mobili complesse e costose che circondano la distribuzione video.
SmartVideo gestisce automaticamente il caricamento, la codifica, l'hosting e distribuisce i tuoi video indipendentemente da dove li memorizzi, che si tratti di YouTube, Dropbox, Amazon S3, Google Cloud e così via.
Perché Swarmify SmartVideo?
La piattaforma Swarmify SmartVideo aiuta le aziende a risolvere alcuni dei problemi più difficili nello streaming video: buffering e qualità dello streaming. SmartVideo impedisce anche ai Mi piace di YouTube di sottrarre il tuo traffico utilizzando lettori video carichi di link.
Grazie alla nostra soluzione di consegna, puoi fornire video 12 volte più veloci della media dei giocatori del settore . La stessa piattaforma di consegna ti aiuta anche a ridurre gli stalli di 8 volte .
“Swarmify SmartVideo è stato lanciato a maggio 2017. Abbiamo assistito a una crescita enorme ogni mese. Sempre più aziende stanno riconoscendo il costo effettivo dell'utilizzo di YouTube. Prima di SmartVideo, la nostra soluzione era disponibile solo per le grandi aziende. In totale, abbiamo recentemente celebrato lo streaming di oltre cinquecento milioni di video", afferma Nathan Barnett, CEO di Swarmify. "Se il tuo sito web si carica velocemente, ma il tuo video si carica lentamente, perderai comunque quel cliente". Fonte: YourStory.com
SmartVideo ti aiuta a fornire video veloci, senza buffer e di alta qualità sul tuo sito Web Beaver Builder. Ti offriamo un lettore video privo di ingombri che non contiene collegamenti e marchi di terze parti, consentendoti di offrire esperienze video professionali ai visitatori del tuo sito web.
Ecco alcune delle caratteristiche che rendono SmartVideo la migliore piattaforma di accelerazione video in circolazione.
- Lettore video pulito e privo di distrazioni: YouTube e altre piattaforme ingombrano il loro lettore di link per sottrarre il tuo traffico. Il lettore SmartVideo è pulito, personalizzabile e privo di perdite.
- Conversioni automatiche di YouTube e Vimeo - Se utilizzi già video YouTube o Vimeo sul tuo sito Beaver Builder, SmartVideo converte automaticamente tutti i video non appena installi il nostro plugin WordPress.
- Ottimizzato su ogni dispositivo, il che significa che i tuoi video possono essere visualizzati su qualsiasi dispositivo e browser.
- Larghezza di banda e spazio di archiviazione illimitati
- Riproduzione veloce, senza buffer e a prova di stallo
- Supporto continuo fornito da sviluppatori super talentuosi e amichevoli
- Struttura dei prezzi semplice senza contratti loschi
- Analisi del coinvolgimento video
- CDN video globale per fornire video incredibilmente veloci agli utenti, indipendentemente da dove si trovino nel mondo
- Eccetera.
Swarmify SmartVideo è un punto di svolta nel campo dell'accelerazione video. Mettiamo in tavola molta esperienza lavorativa e competenza.
Inoltre, l'installazione di SmartVideo sul tuo sito Web Beaver Builder è incredibilmente semplice, come imparerai nella prossima sezione. Ma se sei bloccato, puoi sempre contattarci :) Siamo sempre felici di aiutarti.
Muovendosi rapidamente, installiamo SmartVideo sul tuo sito Web Beaver Builder.
NB: per la prossima sezione, avrai bisogno di un account Swarmify attivo. Non hai ancora un conto? Creane uno oggi e approfitta del tuo esclusivo sconto del 50%.
Come integrare Swarmify SmartVideo con un sito Web di Beaver Builder
Poiché Beaver Builder funziona con WordPress, utilizzeremo il plug-in SmartVideo gratuito . Dopo aver creato il tuo account Swarmify, scarica il plugin SmartVideo WordPress sul tuo computer.
Quindi, accedi alla dashboard di amministrazione di WordPress e vai a Plugin > Aggiungi nuovo , come mostrato di seguito.
Quindi, fai clic sul pulsante Carica plug -in, seleziona il plug-in SmartVideo dal tuo computer e premi Installa ora :
Successivamente, attiva il plug-in:
Non ci siamo ancora: è ora di collegare il tuo sito web al tuo account Swarmify.
Come?
Fai clic su SmartVideo nel menu di amministrazione di WordPress, come evidenziato di seguito.
Nella dashboard SmartVideo, fare clic sul pulsante Configura :
Ciò ti porta alla seguente pagina di configurazione, che contiene le istruzioni e una GIF interattiva che mostra esattamente cosa devi fare dopo.
Ma per risparmiarti la fatica, accedi rapidamente al tuo account Swarmify e copia la chiave CDN Swarm in alto:
Torna alla pagina di configurazione di SmartVideo in WordPress, scorri verso il basso, incolla la chiave Swarm CDN e fai clic su Abilita SmartVideo , come mostrato di seguito.
È piuttosto semplice; Non mi aspetto che affronti difficoltà. Una volta terminato, dovresti vedere l'etichetta verde Abilitata in alto:
Prima di apprendere come aggiungere un video SmartVideo al tuo sito Web Beaver Builder, esaminiamo alcune delle impostazioni SmartVideo disponibili nella pagina precedente.
Fai clic sulla scheda Impostazioni , come evidenziato nella schermata qui sotto.
In questo modo si accede alla seguente pagina delle impostazioni.
Esaminiamo brevemente ogni sezione. Ho numerato le sezioni in modo appropriato per il tuo piacere.
(1) In cima, hai la possibilità di attivare o disattivare SmartVideo. Ovviamente, vuoi mantenere SmartVideo sempre abilitato per garantire le migliori prestazioni.
(2) Opzioni di base
Hai la seconda sezione con un paio di opzioni di base per personalizzare il tuo lettore SmartVideo e l'esperienza. Le opzioni disponibili includono:
- Attiva o disattiva le conversioni automatiche di YouTube e Vimeo : seleziona la casella di controllo per convertire automaticamente i video di YouTube e Vimeo già sul tuo sito. Attiva e lascia così.
- Mostra sottotitoli quando disponibili da fonti YouTube - A meno che non sia essenziale, lascia deselezionata questa casella di controllo.
- Ottimizza video di sfondo e video esistenti : attiva questa opzione e SmartVideo ottimizzerà i video esistenti e i video di sfondo. Attiva e lascia così.
- Cambia la forma del pulsante di riproduzione - Autoesplicativo. Hai tre scelte di forma: Predefinito (o Esagono ), Rettangolo e Cerchio . Scegli quello che ti piace. La forma predefinita funziona per me :)
- Scegli un colore che corrisponda ai componenti del video player con i colori del tuo sito web - Anche in questo caso, hai la possibilità di personalizzare l'aspetto del tuo video player sul tuo sito. Scegli il tuo colore personalizzato da qui :)
Di seguito abbiamo...
(3) Opzioni avanzate
Quando carichi la pagina delle impostazioni, la sezione Opzioni avanzate viene compressa. Clicca sul titolo per caricare la sezione, che ti offre le seguenti opzioni.
- Attiva o disattiva il metodo di layout alternativo : questa opzione è utile se si verificano problemi di dimensioni video dispari o schermo intero. Spunta la casella di controllo.
- Attiva o disattiva l'accelerazione del caricamento : in caso di problemi con il caricamento dei video, attiva questa opzione .
- (Solo piano Pro) Imposta una filigrana : qui puoi impostare un'immagine o un logo come filigrana per il lettore video. Questo è ottimo per scopi di branding, quindi usa la tua immagine/logo migliore.
- (Solo piano Pro) Aggiungi URL annuncio VAST - Qui è dove inserisci l'URL dell'annuncio se stai cercando di monetizzare i tuoi video con annunci pubblicitari di AdSense, DFP, SpotX e così via.
Una volta che hai le impostazioni corrette, non dimenticare di fare clic su Salva impostazioni nella parte inferiore della pagina.
Detto questo, aggiungiamo un video intelligente alla tua pagina di Beaver Builder.
Come aggiungere SmartVideo a una pagina Beaver Builder
Sto usando la stessa pagina che ti hai mostrato prima a scopo illustrativo. Sostituirò l'immagine contrassegnata in alto con uno SmartVideo:
Ho preso in prestito il video SpaceX Launches dal canale YouTube di SpaceX. È lo stesso video nella nostra demo (per favore controlla).
NB: se YouTube è la tua fonte, assicurati di utilizzare il link di incorporamento (ad esempio, https://www.youtube.com/embed/gmJgW-yMAIg ) invece del link di visualizzazione diretta (ad esempio, https://www. youtube.com/watch?v=gmJgW-yMAIg ).
Per trovare il link di incorporamento, vai sotto il video e fai clic sul pulsante Condividi :
Successivamente, fai clic sul pulsante Incorpora , come mostrato di seguito.
Quindi vai all'interno del popup che appare e copia il link di incorporamento, come evidenziato di seguito.
Vedere? Non è stato così difficile.
NB: Un'altra cosa, se stai acquistando video dal tuo canale YouTube e i tuoi video sono impostati su " privato ", cambialo in "non in elenco".
Con quel preambolo, andiamo avanti.
Apri la tua pagina in Beaver Builder:
Dato che sto sostituendo l'immagine, devo prima eliminarla facendo clic sull'icona Rimuovi in questo modo:
Il che mi lascia con una colonna vuota:
Suggerimento professionale : puoi saltare il passaggio precedente se non stai sostituendo un'immagine come nel mio caso. Assicurati solo di avere una colonna o una riga vuota in cui stai aggiungendo il tuo video. Se hai già utilizzato Beaver Builder, non dovrebbe essere un problema.
Quindi, fai clic sull'icona Aggiungi contenuto modulo ( + ) più in alto:
Successivamente, trascina e rilascia il blocco di contenuti SmartVideo dove desideri posizionare il video:
Trascinando e rilasciando il modulo SmartVideo viene visualizzata la simpatica scatoletta mostrata di seguito.
Questa scatola ti permette di fare molte cose. Ad esempio, ti consente di scegliere la tua sorgente video e controllare un paio di opzioni di base e avanzate, ne parleremo tra un minuto.
Quindi, fai clic su Sorgente video , scegli YouTube , incolla il codice di incorporamento e premi Salva , in quest'ordine:
Bello. Puoi già vedere il pulsante di riproduzione esagonale giallo e il video player anche prima di fare clic su Salva.
Fai clic su Fine in alto e poi su Pubblica :
Suggerimento professionale : puoi salvare la bozza se stai ancora lavorando sulla pagina.
Se controllo il mio video intelligente sul frontend, vedrò il video nel lettore video privo di ingombri. Il video è già ottimizzato e accelerato da Swarmify, come puoi vedere di seguito.
Nessun marchio YouTube, nessun buffering e nessun link che sottrae il tuo traffico. Oh sì, non ci sono nemmeno "Video consigliati" quando metto in pausa il video. Inoltre, si carica abbastanza velocemente :)
Ma sembra stranamente piccolo, ma è perché non ho cambiato la larghezza della mia colonna in Beaver Builder. Puoi modificare la larghezza delle colonne e spostare le cose finché non ottieni la giusta dimensione.
Ho giocato con la larghezza della mia colonna e modificato alcuni contenuti, e questo è quello che ho ottenuto"
Non male. Più grande è meglio dopotutto :)
Ora parliamo delle opzioni di base e avanzate di cui abbiamo parlato un secondo fa. Sai? Quando stavamo aggiungendo il video e quella simpatica scatoletta è spuntata fuori?
Fare clic all'interno del modulo di contenuto SmartVideo all'interno di Beaver Builder:
In questo modo si accede alle seguenti opzioni, dove è possibile visualizzare le opzioni Base e Avanzate:
A differenza delle opzioni di base e avanzate che abbiamo trattato quando abbiamo collegato il tuo sito al tuo account Swarmify, le opzioni di cui sopra ti consentono di personalizzare il comportamento del giocatore, in mancanza di una parola migliore.
Questo è quello che voglio dire. Vai avanti e fai clic su Opzioni di base , che ti porta qui:
Basta guardare quello! Molte opzioni per controllare cose come la larghezza, l'altezza del lettore video, la riproduzione di video in linea (ottimo per il browser del sistema operativo Safari) e il design reattivo.
Hai anche controlli come Autoplay (se lo attivi, assicurati che il tuo video venga riprodotto automaticamente) , Muto (il video inizia in modalità mute) , Loop (il video continua a essere riprodotto) e persino uno per disattivare i controlli (ma non farlo perché gli utenti non saranno in grado di riprodurre, mettere in pausa o abbassare il volume, il che è fastidioso).
Quindi hai la scheda Avanzate , che assomiglia a questa:
Ancora una volta, una barca di opzioni per personalizzare ulteriormente il tuo lettore video. Aggiungi animazioni (fai rimbalzare il video quando la pagina viene caricata), imposti la spaziatura attorno al video player e molto altro ancora.
Ancora una volta, come sempre, non dimenticare di salvare le modifiche quando hai finito.
Pensieri finali
Beaver Builder è un generatore di pagine piuttosto elegante. È potente al di là di quello che immagineresti all'inizio, ma una volta che entri lì e inizi ad armeggiare, ti rendi subito conto di avere uno strumento formidabile per costruire qualsiasi sito Web moderno.
Ma non è progettato per l'ottimizzazione video o addirittura per l'accelerazione; è semplicemente un generatore di pagine. È qui che entra in gioco la soluzione Swarmify SmartVideo. Ti aiutiamo a fornire esperienze video rapide e professionali sui tuoi siti Web Beaver Builder.
Il tutto senza i pesanti costi, i limiti e le sfide tecniche che accompagnano la maggior parte degli host di video.
Abbiamo tralasciato qualcosa? Contattaci in qualsiasi momento e saremo felici di chattare.