• Hallo,

    Regelmatig plaatsen bezoekers foto’s op mijn blog (comments). Helaas zijn deze foto’s vaak te groot om correct te worden weergegeven in mijn thema.

    Ook worden deze foto’s vaak gewoon helemaal niet weergegeven. Ik zie regelmatig op andere blogs dat deze foto’s automatisch worden geschaalt naar column breedte.

    Hoe kan ik dit probleem het beste oplossen? Is hier een script, command line of plugin voor?

    http://www.alfablog.nl

2 reacties aan het bekijken - 1 tot 2 (van in totaal 2)
  • Ik heb even snel het blog bekeken. De foto’s in de comments staan op andere sites, toch? Ze worden niet ge-upload op jouw server?

    Dan zijn er volgens mij maar twee mogelijkheden:
    1) in de xhtml bij de img tag een width meegegeven (volgens mij heb je dat nu ook zo opgelost, toch?): bijvoorbeeld ‘width=400’;
    2) in de css bij de img aangeven dat de width 400px moet zijn.

    Een andere oplossing zou zijn dat de bezoekers hun foto’s bij jou uploaden. Dan kun je wel wat dingen ermee doen. Als je dat wilt, zou deze plugin iets voor je kunnen zijn.

    Thread starter Corse

    (@corse)

    Bedankt voor je reactie.

    Waar kan ik dit in de stylesheet aanpassen?

    Dit is de huidige situatie:

    /*
    Theme Name: RockinNewspaper for Adsense 3Col
    Author URI: http://www.corymiller.com
    Version: 1
    Author: Cory Miller
    Description: RockinNewspaper 3 Column for AdSense is a white and red, widget ready, clean and simple theme designed with a newspaper flair for reading and customization.
    The CSS, XHTML and design is released under GPL:
    http://www.opensource.org/licenses/gpl-license.php*/
    
    body {
    background:#ccc;
    color:#000;
    font-size:11px;
    font-family:Verdana, Helvetica, Arial, sans-serif;
    margin:0;
    }
    
    #container {
    width:960px;
    color:#000;
    background-color:#fff;
    text-align:left;
    border:1px solid #ccc;
    margin:20px auto;
    }
    
    #header {
    color:#000;
    background:#fff url(<?php randomize(header); ?>)
    .jpg) top center repeat-x;
    margin-bottom:0;
    border-top:1px solid #ccc;
    padding:20px 0 26px 25px;
    }
    
    #header h2 {
    color:#000;
    background-color:#fff;
    font-size:35px;
    font-family:Helvetica, Arial, Verdana, sans-serif;
    margin:0;
    }
    
    #header h3 {
    color:#444;
    background-color:#fff;
    font-size:18px;
    font-family:Georgia, "Times New Roman", sans-serif;
    margin:0;
    }
    
    #menu {
    color:#000;
    background-color:#fff;
    font-family:Helvetica, Arial, Verdana, sans-serif;
    font-weight:700;
    font-size:20px;
    margin-bottom:20px;
    text-align:center;
    border-top:1px solid #ccc;
    border-bottom:1px solid #ccc;
    padding:12px 25px;
    }
    
    #menu h2 {
    margin:0;
    padding:10px 25px 12px;
    }
    
    #menu li {
    display:inline;
    list-style-type:none;
    margin:0;
    padding:0;
    }
    
    #menu ul li a {
    color:#f33;
    background-color:#fff;
    text-decoration:none;
    margin:0;
    padding:12px 25px;
    }
    
    #menu ul li a:hover {
    color:#fff;
    background-color:#f33;
    text-decoration:none;
    }
    
    #content {
    width:440px;
    position:relative;
    border-right:1px solid #ccc;
    border-left:1px solid #ccc;
    min-height:660px;
    margin:0 0 20px 233px;
    padding:5px 25px 15px;
    }
    
    #content p {
    line-height:18px;
    margin:0;
    padding:0 0 10px;
    }
    
    #content p img {
    border:none;
    margin-right:5px;
    margin-bottom:3px;
    }
    
    #content h1 {
    color:#ccc;
    background-color:#fff;
    font-size:22px;
    font-family:"Helvetica Bold", "Arial Bold", Verdana, sans-serif;
    font-weight:400;
    line-height:150%;
    margin:0;
    padding:10px;
    }
    
    #content h1 a {
    color:#ccc;
    background-color:#fff;
    text-decoration:underline;
    }
    
    #content h2 {
    color:#f33;
    background-color:#fff;
    font-size:22px;
    font-family:Helvetica, Arial, Verdana, sans-serif;
    font-weight:700;
    line-height:120%;
    margin:0;
    }
    
    #content h3 {
    color:#36f;
    background-color:#fff;
    font-size:15px;
    font-family:Helvetica, Arial, Verdana, sans-serif;
    font-weight:700;
    margin-bottom:10px;
    line-height:120%;
    border-bottom:1px solid #ccc;
    }
    
    #content ol {
    list-style-type:decimal;
    line-height:18px;
    margin:0;
    padding:0 0 10px 30px;
    }
    
    #content ul li {
    list-style:square inside;
    margin:0 0 0 10px;
    padding:5px 0 0;
    }
    
    blockquote {
    font-style:italic;
    color:#666;
    background-color:#fff;
    border-left:1px solid #ccc;
    margin:0 0 0 25px;
    padding:0 25px 0 10px;
    }
    
    #content blockquote p {
    margin:0 0 20px;
    padding:0;
    }
    
    .postspace {
    color:#000;
    background:#fff;
    width:440px;
    height:32px;
    margin:0;
    padding:0;
    }
    
    .postspace2 {
    color:#000;
    background:#FFF;
    width:440px;
    height:0;
    margin:0;
    padding:0;
    }
    
    .postspace3 {
    color:#000;
    background:#FFF;
    width:440px;
    height:15px;
    margin:0;
    padding:0;
    }
    
    #l_sidebar {
    color:#000;
    background-color:#fff;
    width:195px;
    float:left;
    margin-top:0;
    margin-bottom:20px;
    min-height:660px;
    padding:0 15px 15px;
    }
    
    #r_sidebar {
    color:#000;
    background-color:#fff;
    width:195px;
    float:right;
    position:relative;
    margin-top:0;
    margin-bottom:20px;
    min-height:660px;
    padding:0 15px 15px;
    }
    
    #footer {
    color:#000;
    background-color:#fff;
    text-align:center;
    border-top:1px solid #ccc;
    clear:both;
    padding:20px 0;
    }
    
    a,a:visited,#header h2 a,#content h2 a,#content h3 a,#content ul li a {
    color:#f33;
    background-color:#fff;
    text-decoration:none;
    }
    
    a:hover,a:active,#content ul li a:hover {
    color:#000;
    background-color:#fff;
    text-decoration:underline;
    }
    
    #header h2 a:hover,#content h1 a:hover,#content h2 a:hover,#content h3 a:hover {
    color:#000;
    background-color:#fff;
    text-decoration:none;
    }
    
    #menu ul,#content li {
    margin:0;
    padding:0;
    }
    
    * html #content,* html #l_sidebar,* html #r_sidebar {
    height:660px;
    }
    
    #content ul,#l_sidebar ul,#r_sidebar ul {
    list-style:none;
    margin:0;
    padding:0 0 20px;
    }
    
    #l_sidebar p,#r_sidebar p {
    line-height:16px;
    margin:0;
    padding:5px 0 10px;
    }
    
    #l_sidebar h2,#r_sidebar h2 {
    color:#f33;
    background-color:#fff;
    font-size:14px;
    font-family:Helvetica, Arial, Verdana, sans-serif;
    list-style:none;
    border-bottom:1px solid #ccc;
    margin:0;
    padding:10px 0;
    }
    
    #l_sidebar li,#r_sidebar li {
    list-style:none;
    margin:0;
    padding:0;
    }
    
    #l_sidebar ul li,#r_sidebar ul li {
    list-style:none;
    border-bottom:1px dotted #ccc;
    margin:0;
    padding:0;
    }
    
    #l_sidebar ul li a,#r_sidebar ul li a {
    display:block;
    color:#000;
    background-color:#fff;
    text-decoration:none;
    padding:5px 0 5px 5px;
    }
    
    #l_sidebar ul li a:hover,#r_sidebar ul li a:hover {
    color:#fff;
    background-color:#f33;
    }
    
    #main_start {position: absolute;left: -10000px;
    }
2 reacties aan het bekijken - 1 tot 2 (van in totaal 2)
  • Het onderwerp ‘WordPress schaalt geen afbeeldingen’ is gesloten voor nieuwe reacties.