Tema Divi

Divi tema, nameščena na Arnes Spletu, je malce okrnjena, zato nimate možnosti vseh nastavitev, nimate vgrajenih vseh modulov … zato se lahko prikazi v dokumentaciji in videovodičih razlikujejo od dejanskega stanja. Še vedno pa je to tema z največjo možnostjo prilagajanja.

Divi Builder

Pri izdelavi nove strani ali prispevka vas pričaka gumb “Use The Divi Builder“.

Ob kliku na gumb se urejevalnik strani / prispevka spremeni. Pričaka vas najprej uvodni vodič. Priporočamo, da si ga ogledate. Ko nadaljujete, lahko najprej izbirate med tremi možnostmi:

• Start Building (zgradite izgled vaše strani, prispevka)
• Browse Layouts (izberete že izdelane predloge)
• Choose Page (izberete izgled strani/prispevka, ki ste ga že zgradili)

Če želite pri obliki strani uporabiti že izdelano predlogo (template), izberite “Browse Layouts“. Vse, kar morate narediti je, da vsebino in medijske datoteke zamenjate s svojimi. Obenem lahko odvečne elemente brišete ali dodajate svoje.

Z izbiro “Start Building” stran pravzaprav zgradite. Najprej določite koliko stolpcev želite imeti v posamezni vrstici. Na voljo imate kar nekaj možnosti razporejanja stolpcev.

Za vsebino v “stolpcih/Column(s)” pa poskrbijo “moduli/Module(s)”.

Pomen gumbov za dodajanje vsebine:

dodamo nov modul z vsebino (“Insert Module“); prikazan je na sliki zgoraj. Od klasičnih velja omeniti: besedilo, slike, video, novice, zavihke, gumbe, naslove, gradnike …

dodamo novo vrstico z razporeditvijo elementov v stolpce (“Insert Row“)

dodamo celoten odsek (“Insert Section“). Izbiramo lahko med:

• klasično postavitvijo stolpcev (“Regular“) – “Insert Row“
• že pripravljeno posebno razporeditvijo (“Specialty“) in
  
• celostransko postavitvijo odseka (“Fullwidth”). V tem primeru nimamo na voljo modulov iz klasične postavitve, dobimo pa nekatere nove možnosti.
  

Prva stran na spletišču http://www.osivanacankarja.si/ je zgrajena takole:

Na sredini spodaj imate gumb , kjer imate na levi strani možnosti simulacije pogleda na različnih napravah, v sredini lahko izvažate in uvažate “layoute” ter naredite nastavitve strani, na desni pa objavite/shranite svoje delo.

Navodila za Divi Builder*

Navodila za module*

Visual Builder

Ko ustvarite stran/prispevek z Divi Builderjem, lahko nadaljujete z urejanjem z “Visual Builderjem“. V urejevalniku ga kasneje vklopite na gumbu v zgornji menijski vrstici.

Odseke, vrstice, stolpce in module uredite, če se z miško pomaknete na element. Prikažejo se ikone za urejanje.

Ustvarjene izglede/postavitve/Layoute strani/prispevka lahko shranite in uporabite še v drugih straneh/prispevkih v istem spletišču ali izvozite izgled in ga uvozite v drugo spletišče, ki uporablja temo Divi.

Sprememba grafične podobe spletišča

Nadzorna plošča → Divi → Theme Options (NAVODILA*)

Nadzorna plošča → Divi → Theme Customizer (NAVODILA* – “tudi za Module Customizer”)

Nadzorna plošča → Divi → Module Customizer

*Vsa navodila in videovodiči se lahko razlikujejo zaradi trenutne različice teme Divi na Arnes Spletu.

Mega meni

Mega meni uporabite, kadar imate veliko število menijskih postavk. Primer: http://www.oszuzemberk.si/ v meniju se zapeljite z miško na postavko “ZNANI SUHOKRANJCI”.

Divi Builder – Classic Editor

Pri izdelavi nove strani ali prispevka vas pričaka gumb “Use The Divi Builder“.

Ob kliku na gumb vas vodi skozi osnovne nastavitve (dodajanja/gradnja novega izgleda, razporeditve stolpcev, določanja modulov). V nadaljevanju potem sami dodajate odseke, razporeditve vrstic in module.

#main-content, .et_pb_section {
  background-color: #6B7F8E;
}
.et_pb_blog_grid .et_pb_post {
  background-color: #6B7F8E;
}

#main-content, #et-main-area, #left-area, #sidebar /*, .clearfix=noga*/ {
 background-image: url("http://www.vrtec-logatec.si/portal/vrtec/templates/kurircek_ver3/images/page.png");
 background-repeat: repeat;
}

#main-content .container:before {
  height: 1%;
  width: 0px;
  background-color: transparent;
}

#sidebar {
 display: none
 }

#logo .et_fixed_nav  {
  max-height: 150px;
}

.et_fixed_nav #logo {
  max-height: 90px;
}
.et-fixed-header #logo {
  max-height: 45px;
}

#et-info {
  font-size: 24px;
  padding-bottom: 10px;
}

#et-info-phone { 
 font-size:130%
}
#et-info-email {
  font-size:130%
}

#top-menu li {
 font-size: 18px;
}

#et-top-navigation {
 font-weight: 600;
 }

#et-secondary-menu {
  font-size: 15px;
}

#et-secondary-menu .menu li a {
 font-size: 16px;
 font-weight: bold;
}

#main-header {
 padding-bottom: 70px;
 background: url(http://delavnica.splet.arnes.si/files/2015/09/barvice-header.jpg) 50% 100%; 
background-repeat: no-repeat;
}

#sidebar {
  background-color: #fafafa;
}

@media only screen and (min-width: 1100px) { /* full-size screens */
    .et_left_sidebar #sidebar {  /*left*/
        padding:70px 0 200px 30px; 
        margin:-70px 0 0 -30px;
    }
    .et_right_sidebar #sidebar { /*right*/
        padding:70px 30px 200px 0px; 
        margin:-70px -30px 0 0;
    } 
}
@media only screen and (min-width: 981px) { /* medium-size displays */
    #sidebar { 
        padding:70px 30px 200px 30px; 
        margin:-70px -30px 0 -30px; 
    }
}
@media only screen and (max-width: 981px) { /* mobiles, etc */
    #sidebar { 
        padding:30px 
    }
}

Celotna dokumentacija za temo Divi

http://elegantthemes.com/gallery/divi/readme.html