Tutorial, cum sa ai taburi php.

Cum sa adaugi la o tema wordpress taburi php exact cum vedeti la mine in sidebar sus.Am gasit tutorialul pe net si vreau sa il fac public.

Primul pas in cazul in care tema nu are inclus jQuery adica o librarie javascrypt trebuie sa il bagati in tema voastra. In header.php al temei in tagul  inainte de a fi inchis o sa gasiti si inainte de acest cod se introduce acest simplu cod:

Bun,acum ca am inclus libraria jQuery sa introducem taburile noastre.In sidebar.php inainte de divul sidebar se introduce acest cod.

ARTICOLE
SOCIAL
VIDEO
TEME WP

Articole pe alte bloguri.

Continut tab 2

Continut tab 4

 

Sidebarul temei ca sa dea bine vizual ar trebuii sa aive macar 300px;Am lasat ca si demo aproximativ cum le am eu ca sa va dati seama mai bine.Binenteles puteti sa adaugati cate taburi doriti.Eu de exemplu am 5.

Acum hai sa adaugam si scryptul pentru taburi.

In footer.php dupa acest cod: <?php wp_footer(); ?> si inainte de inchiderea tagului body si tagului html se introduce acest cod.

 

 

Bun,acum hai sai dam si niste stil in style.css

 

#tabs {
float:right;
margin-top:30px ;
width:310px;
margin-right:5px;
}

.tab {color:#222;
float:left;
border:1px solid #888;
background:#BADA55;
padding:3px 5px;
margin-right:3px;
margin-bottom:3px;
cursor:pointer;
position:relative;
}

.tabcontent{color:#222;
font-size:13px;
font-family: verdana, monospace;
display:none;
width:300px;
padding:5px;
background:#EEEEEE;
clear:both;
border:1px solid #ddd;
border-radius:0px 3px 3px 3px;
}

.selected{
top:1px;
}

.tabcontent ul {
padding-left: 20px;
margin: 0;
}

.tabcontent li {
color: #555555;
list-style: square outside none;
}

.tabcontent li a {
color: #555555;
line-height: 22px;
text-decoration: none;
}
.tabcontent li a:hover {
color:red;
background:#fff;

}

Va puteti juca in css pentru ai da alte culori si tot ce se poate face pentru o reusite buna. Daca va incurcati pe undeva contactati-ma. Aveti pagina de contact la blog. O sa mai fac si alte tutoriale pe viitor.

3 comentarii la “Tutorial, cum sa ai taburi php.

Lasă un răspuns

Adresa ta de email nu va fi publicată. Câmpurile obligatorii sunt marcate cu *

Alte articole Populare