Lista simplă de fișiere este menită să ia în mod implicit aspectul temei site-ului dvs. web. Fără modificări ale stilului, ar trebui să arate prezentabil pe site-ul tău WordPress.
Cu toate acestea, dacă doriți să ajustați aspectul, puteți utiliza CSS în cadrul temei site-ului dvs. Prin direcționarea următoarelor elemente HTML, puteți înlocui stilurile încorporate cu propriul dvs. CSS.
Check out aceste Exemple CSS dacă aveți nevoie de ajutor pentru a începe.
Elemente comune pentru toate vizualizările listei de fișiere
Lista de fișiere Wrapper și Container
.eeSFL
: containerul principal pentru listele de fișiere din toate vizualizările..eeFiles
: Un container care conține elementele fișierului.
Structura articolului fișierului
.eeSFL_Item
: reprezintă un fișier individual cu detalii, acțiuni și metadate..eeSFL_Thumbnail
: Deține imaginea în miniatură a fișierului..eeSFL_FileName
: Afișează numele fișierului și oferă un link..eeSFL_FileDetails
: Conține metadate (dimensiunea fișierului, data încărcării)..eeSFL_ListFileActions
: Conține butoanele de acțiune pentru fiecare fișier (deschidere, descărcare, editare, ștergere).
Vizualizare tabel-Elemente specifice
Vizualizarea tabelului folosește un tabel HTML tradițional pentru a afișa fișierele. Această vizualizare este receptivă și se va trece la o vizualizare simplă în linie pe ecrane mici.
Container de masă și structură
.eeSFL
acționează ca înveliș principal pentru vizualizarea tabelului..eeFiles
formează structura tabelului.- Coloane de tabel
.eeSFL_Thumbnail
reprezintă o coloană pentru miniatură..eeSFL_FileName
coloana pentru numele fișierului..eeSFL_FileSize
coloană pentru dimensiunea fișierului..eeSFL_FileDate
coloana pentru dată.
- Rând de masă
.eeSFL_Item
reprezintă întregul rând pentru un fișier.
Fiecare coloană (miniatură, nume, dimensiune, dată) este o celulă în interior.eeSFL_Item
.
Tiles View-Elemente specifice
Vizualizarea plăcilor folosește un aspect grilă pentru a afișa fișierele, de la stânga sus la dreapta jos.
.eeFiles
ține elementele de faianță..eeSFL_Tile
acționează ca un singur înveliș al plăcilor, care conține fiecare fișier..eeSFL_FileLink
pentru nume de fișiere pe care se poate face clic..eeSFL_ListFileActions
în țiglă include acțiuni precum Deschidere, Descărcare, Copiere link.
Elemente specifice vizualizării Flex
Vizualizarea flexibilă este proiectată pentru a se răspândi uniform pe lățimea elementului de conținut.
.eeFiles
folosește un aspect flexbox pentru alinierea receptivă a elementelor fișierului..eeSFL_Item
reprezintă containerul de fișiere cu aspect flexibil..eeSFL_Thumbnail
afișează miniatura fișierului într-un rând flexibil..eeSFL_FileInfo
oferă detalii despre fișier lângă miniatură..eeSFL_FileDetails
afișează dimensiunea și data fișierului..eeSFL_ListFileActions
oferă linkuri pentru acțiuni precum descărcarea, copierea și ștergerea.
Încărcați elemente de formular
Structura formularului
#eeSFL_UploadForm
împachetează întregul formular de încărcare..eeSFL_UploadFilesTitle
este titlul formularului de încărcare.
Câmpuri de intrare
#eeSFL_Name
Intrare pentru introducerea numelui utilizatorului care încarcă fișierul.#eeSFL_Email
Intrare pentru introducerea e-mailului utilizatorului care a încărcat.#eeSFL_FileDesc
introducerea textului pentru descrierea fișierului.
Zona de încărcare a fișierelor
#eeSFL_FileInput
pentru selectarea fișierelor.#eeSFL_FileDropZone
pentru încărcarea fișierelor prin glisare și plasare.#eeSFL_FileUploadQueue
afișează fișierele aflate în coadă pentru încărcare.
Butoane și indicatori
#eeSFL_UploadGo
Butonul care inițiază procesul de încărcare.#eeSFL_UploadProgress
arată progresul încărcării fișierelor..sfl_instuctions
oferă instrucțiuni sau note pentru încărcarea fișierelor.