Forum portalu Fan-Strefa.pl

Dla webmastera => Pomoc => Wątek zaczęty przez: Stysia w 18 Sierpień 2011, 19:19:19

Tytuł: Problemy z tłem
Wiadomość wysłana przez: Stysia w 18 Sierpień 2011, 19:19:19
Właśnie na moja strone dodałam ostatnio dodane zdjęcia do galerii. Niestaty w slidebarze, nie ma tła... co sie dzieje? jak moge dodać tło?
mój kod w CSS:
a strona ninjadiary.com

+ jak moge zrobić aby na stronie było wyswietlanych wiecej ostatnio dodanych zdjec?


body {
background: #f1eae8;
}

.topbar {
text-align: center;
text-transform: uppercase;
color: #ffffff;
font-family: tahoma;
letter-spacing: 0pt;
font-size: 12px;
}

.topbar a, .topbar a:visited, .topbar a:active {
color: #ffffff;
text-decoration: none;
padding-left: 5pt;
padding-right: 5pt;
}

.topbar a:hover {
color: #ffffff;
text-decoration: underline;
padding-left: 5pt;
padding-right: 5pt;
}

.footerbar {
text-align: center;
text-transform: none;
color: #f1eae8;
font-family: trebuchet MS;
font-size: 8pt;
}

.footerbar a, .footerbar a:active, .footerbar a:visited {
color: #f1eae8;
text-decoration: none;
}

.footerbar a:hover {
color: #f1eae8;
text-decoration: underline;
}

.contentwhiteblock_headerimage {
background: #fbf6f5;
padding: 5pt;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: #e4d9d6;
border-right-style: solid;
border-right-width: 1px;
border-right-color: #e4d9d6;
}

.contentwhiteblock {
background: #fbf6f5;
padding: 10pt;
border-bottom-style: solid;
border-bottom-width: 1px;
border-bottom-color: #e4d9d6;
border-right-style: solid;
border-right-width: 1px;
border-right-color: #e4d9d6;
}

.header-heading {
display: inline;
text-valign: top;
}

.header-heading-one {
display: inline;
color: #c09694;
font-family: trebuchet MS;
font-size: 8pt;
text-transform: lowercase;
}

.header-heading-two {
display: inline;
color: #e7d1ce;
font-family: trebuchet MS;
font-size: 8pt;
text-transform: lowercase;
font-style: italic;
}

.header-heading-text {
color: #bfb6b6;
font-family: trebuchet MS;
font-size: 8pt;
text-transform: lowercase;
}

.eliteaffs {
text-align: center;
padding: 10pt;
}


.eliteaffs a img {
padding: 10pt;
border-style: solid;
border-width: 1px;
border-color: #efe4e1;
}

.eliteaffs a:hover img {
border-style: solid;
border-width: 1px;
border-color: #bc908d;
}

.sidebarheader {
padding: 5pt;
padding-left: 10pt;
background : #efe4e1;
color: #bc908d;
font-family: trebuchet MS;
font-size: 12pt;
text-transform: none;
}

.sidebarcontent {
padding: 5pt;
padding-left: 5pt;
color: #696464;
font-family: trebuchet MS;
font-size: 8pt;
line-height: 16pt;
text-transform: none;
}

.sidebarcontent a img {
padding: 10pt;
border-style: solid;
border-width: 1px;
border-color: #efe4e1;
}

.sidebarcontent a:hover img {
border-style: solid;
border-width: 1px;
border-color: #bc908d;
}

.sidebarcontent a {
color: #696464;
text-decoration: none;

}

.sidebarcontent a:hover {
color: #696464;
text-decoration: underline;

}


.mainpageheader {
padding: 5pt;
padding-left: 10pt;
background : #efe4e1;
color: #bc908d;
font-family: trebuchet MS;
font-size: 12pt;
text-transform: none;
height: 25pt;
}

.mainpagecontent {
padding: 5pt;
padding-left: 5pt;
color: #696464;
font-family: trebuchet MS;
font-size: 8pt;
line-height: 16pt;
text-transform: none;
}

.mainpagecontent a, .mainpagecontent a:active, .mainpagecontent a:visited {
color: #696464;
text-decoration: none;
}

.mainpagecontent a:hover {
color: #696464;
text-decoration: underline;
}

.mainpagecontent img {
padding: 0px;
border:5px solid #ede7e5;
background-color:#ff0;
margin-top: 10pt;
margin-bottom: 10pt;
margin-left: 1pt;
margin-right: 1pt;
text-align: center;
}

.mainpagecontent a img, .mainpagecontent a:active img, .mainpagecontent a:visited img {
padding: 0px;
border:5px solid #ede7e5;
background-color:#ff0;
margin-top: 10pt;
margin-bottom: 10pt;
margin-left: 1pt;
margin-right: 1pt;
text-align: center;
}

.mainpagecontent a:hover img {
border:5px solid #e4ddda;
background-color:#ff0;
text-align: center;
}

img {
border-width: 0pt;
}
a img {
border-width: 0pt;
}
a:hover img {
border-width: 0pt;
}

.dateauthorpost {
display: inline;
text-align: right;
padding-right: 10pt;
color: #dbcac6;
font-family: trebuchet MS;
font-size: 8pt;
float: right;
}

.mainheader {
display: inline;
float: left;
text-align: left;
}

.comments {
display: inline;
float: left;
padding: 10pt;
padding-left: 15pt;
padding-right: 15pt;
margin-top: 20pt;
background: #ece6e4;
text-align: center;
font-family: trebuchet MS;
font-size: 8pt;
color: #696464;
}

.comments a, .comments a:visited, .comments a:active {
color: #696464;
text-decoration: none;
}

.comments a:hover {
color: #696464;
text-decoration: underline;
}

.cats {
display: inline;
float: right;
padding: 10pt;
margin-top: 20pt;
border-right: solid 2pt #b5aca5;
text-align: right;
font-family: tahoma;
font-size: 8pt;
text-transform: uppercase;
color: #b5aca5;
}

.cats a, .cats a:active, .cats a:visited {
color: #b5aca5;
text-decoration: none;
}

.cats a:hover {
color: #b5aca5;
text-decoration: underline;
}

.onecomment {
border: solid 1pt #e7e0de;
padding: 5pt;
background: #f4ecea;
color: #696464;
font-family: trebuchet MS;
font-size: 8pt;
line-height: 16pt;
text-transform: none;
margin-bottom: 6pt;
margin-top: 5pt;
}

.projects-block a {
display: inline;
padding: 2pt;
background: #e0d9d6;
color: #696464;
font-family: trebuchet MS;
font-size: 8pt;
}

.projects-block a:hover{
display: inline;
padding: 2pt;
background: #e0d9d6;
color: #696464;
font-family: trebuchet MS;
font-size: 8pt;
}

.cpmfetchclass img
  {
width: 50px;
border: 1px solid #e0d9d6;
  }
.cpmfetchclass a:hover img
  {
width: 50px;
border: 0px solid #696464;
  }


Tytuł: Odp: Problemy z tłem
Wiadomość wysłana przez: PA_BLO w 18 Sierpień 2011, 19:37:28
Tu dodaj tło:
.sidebarcontent
Tytuł: Odp: Problemy z tłem
Wiadomość wysłana przez: Stysia w 18 Sierpień 2011, 19:53:50
Tu dodaj tło:
.sidebarcontent
to nic nie dało ;/
Tytuł: Odp: Problemy z tłem
Wiadomość wysłana przez: PA_BLO w 18 Sierpień 2011, 19:59:30
Może div'a masz niedomkniętego?
Tytuł: Odp: Problemy z tłem
Wiadomość wysłana przez: Stysia w 18 Sierpień 2011, 20:08:23
W slidebarze mam cos takiego:    <!--sidebarwidgetloop--><tr>


<td class="cpmfetchclass" valign="top">
                     <div class="sidebarheader">Ostatnie zdjęcia w galerii</div>
                     <div class="sidebarcontent">
<?php
  include "./gallery/cpmfetch/cpmfetch.php";
  $objCpm = new cpm("./gallery/cpmfetch/cpmfetch_config.php");
  $objCpm->cpm_viewLastAddedMedia(1,4);
  $objCpm->cpm_close();
?>

</div>
</td><!--sidebarcontent-->
 </div>
Tytuł: Odp: Problemy z tłem
Wiadomość wysłana przez: PA_BLO w 18 Sierpień 2011, 22:06:59
<!--sidebarwidgetloop-->
<tr>
<td class="cpmfetchclass" valign="top">
                     <div class="sidebarheader">Ostatnie zdjęcia w galerii</div>
                     <div class="sidebarcontent">
<?php
  include "./gallery/cpmfetch/cpmfetch.php";
  $objCpm = new cpm("./gallery/cpmfetch/cpmfetch_config.php");
  $objCpm->cpm_viewLastAddedMedia(1,4);
  $objCpm->cpm_close();
?>

</div>
</td>
<!--sidebarcontent-->
 </div>

- moim zdaniem div oznaczony kolorem fioletowym nie ma rozpoczęcia, no chyba że <!--sidebarwidgetloop--> to jest rozpoczęcie div'a - ale jakoś mi nie pasuje
- dlaczego znacznik <tr> nie ma zamknięcia na dole? // no chyba, że jest to początek kodu i </tr> znajduje się gdzieś dalej w kodzie, którego tu nie podałaś - ale to z kolei nie pasuje mi z brakiem rozpoczęcia tego div'a o którym wspomniałem powyżej.

Tytuł: Odp: Problemy z tłem
Wiadomość wysłana przez: Stysia w 19 Sierpień 2011, 10:00:44
ok! :)
Poradziłam sobie kod powinien wyglądać tak:
 <!--sidebarwidgetloop--><tr>
                     <td class="contentwhiteblock" valign="top">
                     <div class="sidebarheader">Ostatnio dodane zdjęcia</div>
                     <div class="sidebarcontent">
                                                        <div class="cpmfetchclass">

<?php
  include "./gallery/cpmfetch/cpmfetch.php";
  $objCpm = new cpm("./gallery/cpmfetch/cpmfetch_config.php");
  $objCpm->cpm_viewLastAddedMedia(1,4);
  $objCpm->cpm_close();
?>

</div>
</td><!--sidebarcontent-->
 </div>
                     </td>   
   <!--/sidebarwidgetloop--></tr>






I mam pytanie które juz zadawałam xD jak zrobić aly miniaturki były kwadratowe oraz zeby było ich wiecej? : p

Tytuł: Odp: Problemy z tłem
Wiadomość wysłana przez: PA_BLO w 19 Sierpień 2011, 13:10:34
Żeby ustalić konkretna liczbę miniaturek i wersów, w których maja być wyświetlane - zmieniasz liczby, które masz umieszczone w nawiasie
$objCpm->cpm_viewLastAddedMedia(1,4);To oznacza, że masz jeden wers w którym znajdują się cztery zdjęcia.

Co do zmiany wyglądy to ktoś kiedyś już na forum pisał.

Okay :P

Wystarczy wkleic ponizszy kod do style.css:

.recentimages a img, .recentimages a img:visited {
width:42px;
height:37px;
background-color: #687474;
border-top: 0px solid #687474;
border-left: 1px solid #687474;
border-right: 0px solid #687474;
border-bottom: 1px solid #687474;
padding: 2px;
-moz-border-radius: 2px;
-khtml-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
}

.recentimages a img:hover {
width:42px;
height:37px;
background-color: #647373;
border-top: 0px solid #647373;
border-left: 1px solid #647373;
border-right: 0px solid #647373;
border-bottom: 1px solid #647373;
padding: 2px;
-moz-border-radius: 2px;
-khtml-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
opacity:.70;
filter: alpha(opacity=70);
-moz-opacity: 0.7;
}

i potem w tej ramce gdzie maja sie foty wyswietlac wstawic w <td> class="recentimages"  :P

Wymiary mozna oczywiscie sobie zmienic. Btw podziekowania dla Belii z pattison-robert.net za pomoc z tym :)

U Ciebie miniaturki są umieszczone w <div class="cpmfetchclass">, więc wystarczy że w powyższych stylach zmienisz z:
.recentimages a img, .recentimages a img:visited na .cpmfetchclass a img, .recentimages a img:visited
oraz
.recentimages a img:hover zmieniasz na .cpmfetchclass a img:hover Wysokość i szerokość miniaturek możesz dostosować w stylach w powyższym kodzie :D
Tytuł: Odp: Problemy z tłem
Wiadomość wysłana przez: Stysia w 19 Sierpień 2011, 16:47:03
No oki... widziałąm to włąsnie.. ale to nic nie daje... zdjęcia są włąśnie jeszcze większe ;p