PDA

Zobacz pełną wersję : Modyfikacja blogu Wordpress proszę o pomoc



manfred
06-03-2014, 17:41
Poszukiwany spec od Wordpress

Mam stronę jaką mam trudno www.manfred.com.pl . Potrzebuje dobrej duszy która pomoże mi zakładki "kategorie" wyłożyć na wierzch jak w photoshopie :-) Za pomoc dziękuję

superlama
06-03-2014, 19:57
Magikiem nie jestem, ale szybki google mówi, żeby się zainteresować z-index.

Wybadałem, że używasz nggallery - tutaj jest ten problem opisany:
http://wordpress.org/support/topic/nextgen-gallery-hides-the-sites-dropdown-menu

docxxx
06-03-2014, 20:11
Potrzebuje dobrej duszy która pomoże mi zakładki "kategorie" wyłożyć na wierzch jak w photoshopie

Możesz jaśniej?

manfred
06-03-2014, 20:14
Na mojej stronie jest zakładka KATEGORIE i jak na nią kliknę to otwierając się jest na spodzie tak jak w przypadku warstw w photoshopie. No już prościej nie umiem wyjaśnić.

superlama
06-03-2014, 20:16
Na mojej stronie jest zakładka KATEGORIE i jak na nią kliknę to otwierając się jest na spodzie tak jak w przypadku warstw w photoshopie. No już prościej nie umiem wyjaśnić.
Spróbuj w style.css, w bloku:
#navigation ul li {
width: 170px;
display: block;
}
dodać z-index: 9998

czyli blok powinien tak wyglądać:
#navigation ul li {
width: 170px;
display: block;
z-index: 9998
}

manfred
06-03-2014, 20:18
To jest mój kod z bloga ale nie mam zielonego pojęcia jak to zmienić. Zaraz sprawdzę

/*
Theme Name: photograph
Version: 1.0
Author: Marcin Triebs
Author URI: http://ibstudio.pl/
Tags: one-column, cyan, white, fixed-width
*/

* {
padding: 0px;
margin: 0px;
}

.aligncenter, div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}

.alignleft {
float: left;
}

.alignright {
float: right;
}

body {
background: center url('images/bg.png') repeat-y #d9e5f0;
margin: 0;
font-family: "Myriad Pro", "Myriad Pro Cond", "Myriad Pro Light";
font-style: normal;
}

#wrap {
width: 900px;
margin: 0px auto;
}

#header {
background: transparent;
width: 153px;
height: 153px;
}

#header a {
color: #757575;
text-decoration: none;
}

#header h1 {
font-size: 39px;
line-height: 39px;
font-weight: normal;
}

#header small {
font-size: 19px;
line-height: 19px;
}

#s {
float: right;
width: 150px;
padding: 2px;
background: transparent;
border: 0px none;
border-bottom: 1px solid #444;
color: #444;
margin-top: 5px;
font-size: 15px;
font-family: Georgia;
font-style: italic;
}

#s:focus {
border-bottom: 1px solid #777;
color: #777;
}

#navigation {
height: 41px;
list-style-type: none;
background: #ffffff url('images/button.png') repeat-x ;
border: 0px;
margin: 0px;
position: relative;
display: block;
}

#navigation li {
float: left;
margin-right: 0px;
position: relative;
}

#navigation ul {
position: absolute;
display: none;
top: 41px;
left: -40px;
background: #ffffff;
}

#navigation ul li {
width: 170px;
display: block;
}

#navigation li:hover ul ul, #navigation li:hover ul ul ul, #navigation li:hover ul ul ul ul {display:none;}
#navigation li:hover ul, #navigation li li:hover ul, #navigation li li li:hover ul, #navigation li li li li:hover ul {display:block;}

#navigation li a {
text-decoration: none;
display: block;
font-family: arial;
font-size: 13px;
font-weight: bold;
color: #212b7a;
padding: 13px 10px;
margin: 0;
position: relative;
height: 15px;
overflow: hidden;
}

#navigation .current_page_item a {
color: #5A859F;
text-decoration: none;
display: block;
font-family: arial;
font-size: 13px;
font-weight: bold;
color: #212b7a;
background: #ffffff url('images/buttonh.png') repeat-x ;
}

#navigation li a:hover {
color: #5F5F5F;
background: #ffffff url('images/buttonh.png') repeat-x ;
text-decoration: none;
display: block;
font-family: arial;
font-size: 13px;
font-weight: bold;
color: #212b7a;
}

#navigation li ul li a:hover {
background: #d1e1f1;
}

#navigation .current_page_item a:hover {
color: #5A859F;
background: #ffffff url('images/buttonh.png') repeat-x ;
text-decoration: none;
display: block;
font-family: arial;
font-size: 13px;
font-weight: bold;
color: #212b7a;
}

#content {
width: auto;
padding: 30px;
color: #212121;
border: 0px;
border-top: 0px none;
}

#content .post {
margin-bottom: 30px;
}

#content .post .date {
float: left;
margin: -3px 10px 0px -30px;
padding: 5px 5px 5px 30px;
color: #212121;
background: #EEE;
}

#content .post .date p span, #content #commentlist li .authorinfo small{
font-size: 12px;
}

#content .post .date p strong {
font-size: 30px;
float: left;
margin-top: -2px;
margin-right: 5px;
}

#content h2 {
font-size: 24px;
font-weight: 150;
color: #86abcc;
font-style: italic;
margin-bottom: 10px;
}

#content .post h2 a {
color: #86abcc;
text-decoration: none;
border-bottom: none;
}

#content .post h2 small a{
font-size: 14px;
color: #008AAB;
margin-left: 5px;
text-decoration: none;
}

#content .post h2 small a:hover {
border-bottom: 1px solid #2FA7BF;
color: #008AAB;
}

#content .post h2 a:hover {
color: #86abcc;
}

#content .post .tags {
font-size: 11px;
margin-bottom: 10px;
}

#content .post .contentinner p {
margin: 10px 0px;
}
#content h3 {
font-size: 14px;
font-weight: 100;
color: #a4a1a1;
margin-bottom: 10px;
font-family: Verdana, Geneva, Tahoma, sans-serif;
}

#content .post .contentinner .storycontent {
font-family: "Myriad Pro", "Myriad Pro Cond", "Myriad Pro Light";
font-size: 14px;
font-style: normal;
text-transform: none;
}

#content #commentlist {
margin-left: 20px;
margin-top: 10px;
list-style-type: none;
}

#content #commentlist li {
margin: 10px 0px;
}

#content #commentlist li .authorinfo {
float: left;
width: 300px;
margin: 0px 10px 0px 5px;
}

#content #commentlist li .authorinfo h3 a, #content #commentlist li .authorinfo h3 {
color: #212121;
font-size: 20px;
text-decoration: none;
}

#content #commentlist li .authorinfo .avatar {
float: left;
margin-right: 10px;
}

#content #commentlist li .comment-content {
font-family: "Myriad Pro", "Myriad Pro Cond", "Myriad Pro Light";
font-size: 14px;
display: block;
width: 425px;
margin-left: 300px;
padding-left: 5px;
border-left: 3px solid #008AAB;
font-style: normal;
text-transform: none;
}

#content #commentform #comment {
font-family: "Myriad Pro", "Myriad Pro Cond", "Myriad Pro Light";
font-size: 14px;
font-style: normal;
text-transform: none;
padding: 3px;
}

#commentform p {
margin: 5px 0 5px 0;
}

#content .trackbackrss {
margin-top: 5px;
}

/* Elements */

#content a, #footer a {
text-decoration: none;
color: #008AAB;
}

#content a:hover, #footer a:hover {
border-bottom: 1px solid #2FA7BF;
}

#footer {
color: #EEE;
background: center url('images/footer.png') #222222;
width: 900px;
height: 197px;
text-align: middle;
font-size: 13px;
font-family: Arial;
font-style: normal;
margin: 0px auto 0px;
clear:both;

}

a img {
border: 0px none;
margin-top: 25px;
margin-bottom: 25px;
}

blockquote {
border-left: 3px solid #008AAB;
margin-left: 20px;
padding-left: 5px;
color: #5F5F5F;
}

ul, ol {
margin-left: 40px;
}

#social
{
width: 240px;
height: 100%;
float: right;
}

#archiwum
{
width: 240px;
height: 100%;
float: left;
}
#about
{
width: 420px;
height: 100%;
float: right;
}

#footer h4
{
color: #ffffff;
margin-left: 50px;
margin-top: 30px;
font-size: 18px;
font-weight: 100;
}

#light
{
float: right;
width: 190px;
height: 23px;
background: url('images/footer_light2.png');
margin-top: 3px;
line-height: 1.8em;
}

#light2
{
width: 320px;
height: 101px;
background: url('images/footer_light.png');
margin-top: 3px;
margin-left: 50px;
}

#light a
{
margin-left: 40px;
margin-bottom: 3px;
color: #928c8c;
}

#light2 h5
{
margin: 5px;
color: #928c8c;
font-weight: 100;
font-size: 13px;
font-family: Arial;
font-style: normal;
padding: 5px;
}

#slideshow {
position:relative;
height:153px;
}

#slideshow IMG {
position:absolute;
top:0;
left:0;
z-index:8;
opacity:0.0;
}

#slideshow IMG.active {
z-index:10;
opacity:1.0;
}

#slideshow IMG.last-active {
z-index:9;
}
.feedback {
clear:both;
}

superlama
06-03-2014, 20:21
To jest mój kod z bloga ale nie mam zielonego pojęcia jak to zmienić. Zaraz sprawdzę
Panie, to nie tak.

Masz w panelu administracyjnym Wordpressa edytor kodu - po lewej "wygląd->edytor", po prawej z listy wybierasz plik style.css.

manfred
06-03-2014, 20:23
No ja robię tu
https://www.dropbox.com/s/0hplwz1bkgsxbln/Zrzut%20ekranu%202014-03-06%2019.21.59.png

superlama
06-03-2014, 20:25
No ja robię tu
https://www.dropbox.com/s/0hplwz1bkgsxbln/Zrzut%20ekranu%202014-03-06%2019.21.59.png

No ok - i tam jest taki akapit:


#navigation ul li {
width: 170px;
display: block;
}

między display: block; a }

dodaj:

z-index: 9998

Tak jak wyżej pisałem.

manfred
06-03-2014, 20:27
Czyli tak
#navigation ul li {
width: 170px;
display: block;
z-index: 9998

Archiwum wyszło na wierzch ale kategorie dalej są pod spodem

manfred
06-03-2014, 20:35
Ej nie zostawiaj mnie pomóż błagam ;-)

QubaKpl
06-03-2014, 20:43
Ej nie zostawiaj mnie pomóż błagam ;-)

Czyli chcesz mieć te kategorie(dzieci, foto ślubna) w menu na wierzchu ?

manfred
06-03-2014, 20:45
Czyli chcesz mieć te kategorie(dzieci, foto ślubna) w menu na wierzchu ?
Tak

QubaKpl
06-03-2014, 20:46
Tak

Daj login i hasło to spróbuje ci to zrobić, coś tam znam wordpresa. Reszta na pw ;]

superlama
06-03-2014, 20:49
Daj login i hasło to spróbuje ci to zrobić, coś tam znam wordpresa. Reszta na pw ;]
No z hasłem to na pewno szybciej;)

Sorry za lagi, nie siedzę cały czas przy kompie.

manfred
06-03-2014, 20:51
Poszło na PW

A tak na marginesie może mi ktoś doradzić szablon który byłby podobny do tego który mam chodzi mi o wyświetlanie zdjęć i możliwości dodawania kategorii.

sruba
07-03-2014, 13:38
Każdy szablon daje ci możliwości dodawania kategorii. Jeśli chodzi o dużą bazę szablonów i motywów to polecam to: http://www.templatemonster.com/wordpress-themes.php. Motywy są płatne, ale po pierwsze ceny nie zabijają, a po drugie można trafić na promocję, ja swój kupiłem za pół nominalnej ceny :-) Problemem są ewentualne zmiany, które chcesz wprowadzać, nie wszystko się da i nie wszystkie pluginy będą działać. Ja na swojej chciałem zmienić sposób wyświetlania zdjęć, próbowałem dodać nextGen'a ale gryzł się z szablonem... dopiero interwencja brata-informatyka pomogła, ale musiał od nowa napisać skrypt galerii w taki sposób, żeby to wszystko razem pracowało, więc modyfikacje takiego szablonu mogą być już grubszą sprawą. Są też darmowe motywy wordpressa, one też dają dość sporo możliwości twórczych, można zmieniać kolory tła, przycisków, dodawać obrazki w nagłówkach, no jest trochę i da się coś sensownego wykrzesać.

Co do problemu, który poruszałeś - wyświetlania kategorii na pasku Menu (bo tak to zrozumiałem) to robi się to w Wygląd - Menu. Z lewej strony rozwijasz Kategorie (już powinny być utworzone, menu organizujesz na końcu) i zaznaczasz które chcesz dodać i wciskasz przycisk Dodaj do Menu. Gotowe, na pasku wyświetlają ci sie obok siebie wszystkie kategorie które zaznaczyłeś.