Temat: Szablon Sela CSS

Hej,

zastąpiłam poprzedni szablon nowym i nie potrafię zrobić kilku rzeczy:

1. Muszę koniecznie wywalić te główne zdjęcia, które pojawiają się za tytułem wpisu. Znalazłam porady, by zmienić w CSS przy linijce z obrazkiem "block" na "none" i rzeczywiście zdjęcia zniknęły, ale za to pierwszy wpis od góry wjechał na pasek menu, a każdy kolejny wjeżdżał na końcówkę poprzedniego, zasłaniając połowę "continue reading".

2. Chcę rozszerzyć główne okno, czyli to z tekstem wpisu. Z lewej strony jest za dużo wolnej przestrzeni, więc jak środkowa kolumna się trochę rozszerzy, będzie lepiej. Nie wiem jednak, która linijka za to odpowiada i co zmienić.

3. Zmieniłam wszystkie "continue reading", które znalazłam w kodzie, na "czytaj dalej", a strona i tak uparcie wyświetla oryginalny napis. Chcę zmienić na polski zarówno to, jak i "older/newest posts".

4. Jeśli się da, chciałabym bez instalowania wtyczek zwiększyć liczbę tagów w chmurze, ale to już taka dodatkowa pierdoła, najbardziej zależy mi na pierwszych trzech punkach.

Adres bloga: http://livingonmyown.pl

W razie czego mogę skopiować fragmenty kodu.

Z góry dzięki.

Temat: Szablon Sela CSS

Obawiam się, że chcesz dokonać istotnych zmian w gotowym szablonie. Moim zdaniem lepiej poszukać szablonu, który bardziej spełnia Twoje oczekiwania, niż grzebać w kodzie. Jest to oczywiście możliwe, lecz trzeba mieć trochę pojęcia o CSS; nie wiem, czy grzebanie jest warte zachodu po prostu.

Ad 1.

Do klasy:

.post-thumbnail {
margin-left: -55px;
width: 107.1%;

dodaj display: none
i po kłopocie.

Za zachodzenie odpowiada ujemny margin:

.post-thumbnail + .entry-header {
background-color: #FFF;
margin: -4em 0px 1em 110px;
min-height: 40px;
padding: 1.5em 1.5em 0px 2.25em;

więc go skoryguj (1em załatwia sprawę) .

Ad 2. Za to odpowiada układ blokowy

Za szerokość całości:
.site {
margin: 0px auto;
max-width: 1180px;
padding: 0px;
style.css: 1960

Za szerokość głównej kolumny:
content-area {
float: left;
width: 765px;
}
.content-area {
float: left;
width: 68.8644%;
}
(dla różnych szerokości ekranu)

style.css: 1911 i 1972

Za szerokość bocznego panelu:
.sidebar-widget-area {
width: 250px;
}
.sidebar-widget-area {
float: right;
margin: 0px;
width: 21.1864%;
}
.sidebar-widget-area, .footer-widget-area .widget-area {
margin-right: 15%;
margin-left: 15%;
}
style.css: 2055, 1915 i 1750

Sprawdź tylko, czy po zmianach się nie rozjeżdża.

Ad. 3 Continue reading może być w zbiorze tłumaczenia .po

Ad. 4 Nie wiem :)Ten post został edytowany przez Autora dnia 15.12.15 o godzinie 17:20

Temat: Szablon Sela CSS

Ad. 1.

Nie mam takiego fragmentu, jak podałeś. Mam:

.post-thumbnail {
margin: 0 -5.1%;
}
.post-thumbnail + .entry-header {
margin: 1.5em 0;
padding: 0;
}
.entry-thumbnail img,
.post-thumbnail img {
display: block;
}

Tu, gdzie "block" wpiszę "none", wtedy zdjęcia znikną, ale nie wiem, gdzie przesunąć wpisy.

Ad. 2.

Tu też nie mogę zaleźć podanych przez Ciebie liczb, mam za to jakieś procenty.

.content-wrapper {
background: #fff;
padding: 3em 4.661%;
position: relative;
}
.content-wrapper.with-featured-image {
padding: 1.5em 4.661%;
}

/* Front Page Template */
.front-page-content-area.content-area {
float: none;
margin: 0;
width: 100%;
}
.front-page-content-area .hero {
position: relative;
}
/* Front page content with featured image */
.hero-content {
position: relative;
}
.hero-content > img {
display: block;
}
.hero-container-outer {
display: table;
width: 100%;
height: 100%;
}
.hero-container-inner {
display: table-cell;
text-align: center;
vertical-align: middle;
}
.front-page-content-area .with-featured-image {
border-bottom: 1px solid #f2f2f2;
padding-right: 4.661%;
padding-left: 4.661%;
}
.front-page-content-area .with-featured-image .entry-header {
margin-top: 1.5em;
padding: 0;
}
.front-page-content-area .with-featured-image .entry-content {
margin-bottom: 1.5em;
padding: 0;
}
.front-page-content-area .with-featured-image {
border-bottom: 1px solid #f2f2f2;
padding-right: 4.661%;
padding-left: 4.661%;
}
.hero-content-overlayer {
height: 100%;
overflow: auto;
position: static;
top: auto;
}

/* Front Page Widget Area and Testimonials */
.front-widget-area {
border-bottom: 1px solid #f2f2f2;
}
.front-widgets .widget {
font-size: 16px;
font-size: 1.6rem;
margin-bottom: 2.25em;
}
.front-widget-area .widget-title {
color: #4f4f4f;
font-family: "Oswald", Arial, sans-serif;
font-size: 21px;
font-size: 2.1rem;
font-weight: 300;
}

/* Grid Page */
.grid-page-content-area .entry-content {
min-height: 0;
}
.grid-page-content-area .hentry:after,
.child-pages .hentry:after {
display: none;
}
.child-page {
float: none;
margin: 0 auto;
max-width: 334px;
}
.child-page .entry-thumbnail img {
display: block;
}
.child-page .entry-header {
margin: 1.5em 0;
padding: 0;
}
/* Full-Width Page Template */
.content-wrapper.full-width.with-featured-image {
margin: 0;
padding: 1.5em 4.661% 0;
}

.content-wrapper.full-width .content-area {
width: 100%;
}
.content-wrapper.full-width .hentry:after {
left: -9.1%;
width: 109.1%;
}

Temat: Szablon Sela CSS

Zainstaluj sobie dodatek dla twórców witryn dla FF - wtedy możesz analizować kod odpowiednich elementów.

Klasy mogą być używane w różnych konfiguracjach - jak we wklejonych przykładach.

Podałem w niektórych przypadkach nr linii w pliku css, więc szukaj tam.

Temat: Szablon Sela CSS

Nie potrafię zrobić żadnej z tych rzeczy. Nie rozumiem wyrazów i liczb, na które patrzę. Na dodatek stworzyłam child-theme do mojego motywu, bo przeczytałam, że w ten sposób nie stracę zmian po aktualizacji motywu-matki. Problem w tym, że nanoszone w nowym pliku style.css zmiany nie wpływają na wygląd bloga. Tylko zmianami w pliku style.css oryginalnego szablonu (szablonu-matki) cokolwiek zmieniam. Dlaczego? Co robię źle?

Temat: Szablon Sela CSS

Dobrze jest poczytać trochę o CSS. To wiele wyjaśni. Podstawy CSS są naprawdę proste. Ja się uczyłem z książki CSS - nieoficjalny podręcznik. Wszystko jest łopatologicznie wyjaśnione. Bez tego robisz zmiany, których nie rozumiesz.

Child theme - dobry pomysł. Czy jednak zrobiłaś wszystko tak, jak trzeba ze stylem potomnym? Odpowiednie katalogi i pliki?

Plik style.css motywu potomnego wczytuje się na końcu i nadpisuje styl css motywu głównego. Jeśli wszystko jest zrobione poprawnie, to musi tak być.

Czy w zakładce wygląd masz wyraźnie wskazane, że używasz stylu potomnego (child)? WP ładnie rozpoznaje motyw potomny. Od tego bym zaczął sprawdzenie, czy wczytuje Ci się styl potomny. Potem plik potomny css we właściwym katalogu.

Temat: Szablon Sela CSS

Już mi wskazano, że zrobiłam błąd, nie domykając fragmentów kodu symbolem }.

Dzięki za odpowiedzi!