Cel mai bun editor WYSIWYG Magento 2 pentru comerțul electronic

Conţinut

Magento 2 este printre cele mai utilizate platforme CMS open-source pentru magazinele online. Aproximativ 20% din toate site-urile de comerț electronic la nivel global se bazează pe platformă și peste 155 de miliarde de dolari sunt procesate în tranzacții gestionate de capabilitățile sale.

Editorul Magento wysiwyg permite editarea conținutului aferent tuturor celor care nu sunt familiarizați cu HTML, ceea ce accelerează publicațiile făcând inutilă specificarea manuală a etichetelor și a atributelor. Ca atare, puteți vedea aspectul final al proiectului în Magento 2 devreme.

Ce este Magento 2 WYSIWYG Editor?

Dacă vă întrebați ce este un editor wysiwyg, atunci ați găsit în sfârșit răspunsul.

WYSIWYG (What You See Is What You Get) este destinat pentru editarea formei de prezentare a unui document fără a face nicio manipulare cu codul sursă și pentru a scrie orice blocuri manual. Tot ceea ce este necesar pentru a fi manipulat sunt componentele încorporate ale editorului pentru a vedea imaginea de ansamblu a unui document, proiect sau eveniment neterminat (WYSIWYG Lighting Design).

Programatorii și programatorii tind să critice această abordare de proiectare, plângându-se de cotele semnificative ale codului „murdar” implicat. Cu toate acestea, editorii moderni se îmbunătățesc în mod constant, iar unii sunt capabili să acorde o calitate bună a fluxului de lucru cu dezavantaje minime.

Inițial, browserele acceptau în primul rând capacitățile de editare WYSIWYG , dar funcțiile de citire au devenit treptat mai concentrate (fără a lua în considerare editarea textului în formularele de introducere). Browserele moderne, totuși, sunt foarte susceptibile la editarea paginilor web. Momentele esențiale la care ar trebui să fiți atenți atunci când faceți modificări includ următoarele.

Modul de personalizare poate fi lansat în două moduri:

• designMode - editarea elementelor individuale (fereastră, cadru);
• contentEditable - editarea elementelor cu text.

Metoda document.execCommand permite lansarea comenzilor (personalizare font, adăugare de linkuri etc.) pentru editarea zonelor și stilizarea etichetelor.

event.preventDefault ar trebui să fie utilizat la lansarea modificărilor butoanelor. În caz contrar, comanda nu va fi executată în timp ce doar butonul este procesat.

Verificarea de securitate text vă permite să vă asigurați dacă conține un element JavaScript dăunător care deschide oportunități de atac XSS. În unele browsere (cum ar fi Firefox), este activat în mod implicit, limitând utilizarea funcțiilor legate de buffer (de exemplu, copiere/lipire). Restricțiile pot fi eliminate cu ajutorul about:config.

Dacă este necesar, conținutul editabil poate fi creat prin HTML, ceea ce vă permite să lucrați cu React, Angular și alte cadre similare pentru gestionarea amănunțită a componentelor a căror conținut nu poate fi editat.

Top 7 soluții software WYSIWYG

Editorii WYSIWYG sunt utilizați pentru crearea de aplicații, site-uri web cu diverse scopuri sau pentru sarcini de gestionare a conținutului. Ele nu necesită neapărat cunoștințe de HTML sau abilități de codare.

Un astfel de editor eficient ar trebui să posede următoarele proprietăți:

• o interfață separată de editare a conținutului bazată pe text
• toate caracteristicile standard de procesare a documentelor;
• o capacitate de a edita codul și de a vedea previzualizarea acestuia într-o publicație;
• integrarea, exportul și publicarea conținutului prin instrumente conectate.

Următoarele soluții software oferă asta și multe altele.

TinyMCE

Unul dintre cele mai accesibile, dar multifuncționale editori care au alimentat Atlassian, Medium și Evernote, printre altele. Suportă implementări cloud și hibride și poate fi integrat cu unele dintre cele mai renumite cadre - React, Vue, Angular.

Editor vizual

Acesta permite efectuarea de modificări și corecții în proiecte fără a fi nevoie să treacă prin marcajul wikitext.

SummerNote

Editor WYSIWYG super simplu în Bootstrap SummerNote - o bibliotecă JavaScript care permite construirea de editoare personalizate online.

Pană

Un editor cu sursă deschisă care poate fi adaptat cu ușurință la cerințele personalizate și la specificul afacerii datorită unei arhitecturi consumabile și a unui API flexibil.

Froala Editor

Un editor bazat pe JavaScript care este ușor de integrat cu cele mai comune medii de dezvoltare și are o interfață fluidă. Un set bun de plugin-uri dedicate și documentație detaliată doar acesta și mai eficient.

CKEditor 4

Un editor bazat pe text cu arhitectură bazată pe browser, care permite utilizarea atât a funcțiilor generale, cât și extinse de procesare a conținutului. Distribuit numai prin licențe comerciale, dar este o soluție open-source.

ContentTools

Un editor bun pentru conținut bazat pe HTML. Are un scor de utilizator destul de mare printre instrumentele WYSIWYG similare.

Citește și: Cum să angajezi cei mai buni dezvoltatori Magento

Editor WYSIWYG Magento 2

În ceea ce privește construirea de resurse eCommerce bazată pe Magento 2, WYSIWYG este utilizat pentru editarea conținutului backend fără abilități de programare necesare. Acestea sunt editorii de bază dedicati Magento de acest fel.

TinyMCE 4 - WYSIWYG Editor Pro

Un editor magento wysiwyg de bază, care este de obicei folosit implicit. Principalele caracteristici includ:

• adăugare prin glisare și plasare pentru fișiere foto/video, încărcări multiple și personalizare a dimensiunii fișierului în timp real;
• titluri și descrieri automate bazate pe titlul fișierului (suport pentru mai multe fișiere, precum și pentru fișiere cu nume în UTF-8 Unicode);
• adăugarea widget-ului Magento, blocuri, variabile și URL-uri;
• căutare, sortare, personalizare și modul de vizualizare inteligentă;
• personalizări aprofundate - widget-urile, galeriile și variabilele pot fi implementate ca plugin-uri, atât în ​​bloc, cât și separat pentru fiecare altă instanță.

Magento 2 Page Builder

Cu acesta, utilizatorii obțin o capacitate mult așteptată de a crea pagini personalizate fără modificări de cod necesare. Page Builder este un editor vizual care permite personalizarea paginilor printr-o interfață convenabilă și intuitivă (prevăzând și drag & drop). Activele sunt adăugate prin glisare și plasare tipuri de conținut pre-preparate - opțiunile disponibile pot fi vizualizate în meniu.

În general, principalele funcții ale tipurilor de conținut includ:

• crearea publicațiilor prin glisare și plasare;
• ajustarea unei previzualizări în magazin;
• construirea de formulare și setări de intrare.

Există două tipuri majore de configurație Page Builder care depind de nevoile utilizatorului final:

• extinderea tipurilor existente;
• crearea celor noi.

Un editor este integrat cu Magento Commerce cu funcționalitatea de bază și este disponibil pentru achiziționare pentru toți proprietarii Magento Open Source.

Citește și: Un ghid complet despre migrarea Magento: Mută-ți magazinul de comerț electronic în Magento de pe orice platformă

Cum se configurează Editorul WYSIWYG în Magento 2 [Actualizat 2021]

Știți deja ce este Magento 2 WYSIWYG Editor și despre cele mai bune soluții software WYSIWYG. Și probabil vă întrebați cum să adăugați Editor WYSIWYG în sistemul Magento 2. Deci, acum este timpul să dezvăluiți cum să configurați editorul WYSIWYG în Magento 2. Continuați să citiți pentru a fi conștient de 4 pași simpli.

Cum să activați/dezactivați Editorul WYSIWYG

Cu Magento 2 WYSIWYG Editor, puteți crea în mod accesibil blocuri și pagini CMS, descrieri de produse și categorii. Este simplu să adăugați și să editați text, widget-uri, link-uri, variabile și imagini fără a implica niciun cod HTML și să vedeți rezultatele imediate ale acțiunilor dvs. în backend.

Trebuie să rețineți, totuși, că editorul adaugă spații suplimentare în cod sau l-ar putea salva în format incompatibil atunci când paginile sau blocurile gata făcute sunt editate, ceea ce poate cauza probleme de marcare și design.

Pentru a evita astfel de posibile dificultăți, este mai bine să activați/dezactivați editorul atunci când se fac modificări de cod HTML, ceea ce necesită următoarea secvență de acțiuni.

1. Accesați Panoul de administrare->Magazine->Configurare;
   
2. Faceți clic pe General->Content Management pentru a vedea opțiunea de activare/dezactivare.
   
3. Wysiwyg este activat implicit. Pentru a o dezactiva, debifați opțiunea Utilizați valoarea de sistem și selectați opțiunea din meniul derulant
   • Dezactivat implicit - editorul HTML va fi vizibil la încărcarea paginii și îl puteți schimba cu un editor WYSIWYG;
   • Dezactivat complet - capabilitățile de editare vor fi complet dezactivate.
   
   
4. Salvați toate modificările. Dacă aveți o problemă cu editorul Magento 2 WYSIWYG care nu funcționează corect, ar trebui să verificați toate cerințele majore și să curățați memoria cache în felul următor:
   • Accesați System->Tools->Cache Management;
     
   • În listă, faceți clic pe Reîmprospătare->Selectați tot->Trimiteți.
     

rezumat

Selectarea unui editor WYSIWYG la crearea unui site web ar trebui să se bazeze pe obiectivele companiei, nevoile, cerințele privind experiența utilizatorului, bugetul, strategia de marketing, fundația tehnică și o grămadă de alte aspecte. Ca atare, nu poate exista o singură opțiune universală cea mai bună. Cu toate acestea, folosirea Magento 2 este o alegere finală a unei companii progresive.

Unii ar putea considera prețul soluției ca fiind nerezonabil, dar fiți siguri că fiecare ban pe care îl cheltuiți pe ea se plătește pe termen lung. Majoritatea provocărilor legate de lucrul cu Magento 2 pot fi rezolvate cu succes dacă aveți alături o echipă de dezvoltatori calificați, experți, cu o bună experiență BA în comerțul electronic.

Dacă încă sunteți în căutarea unui partener de afaceri decent care să vă ajute să rezolvați sarcinile și să depășiți provocările în materie - contactați specialiștii Dinarys chiar acum. Avem o expertiză aprofundată în domeniul comerțului electronic și putem clarifica orice nuanțe, precum și să vă ajutăm să implementați și să vă lansați proiectul cel mai corect și eficient.