Soporte » Plugins y Hacks » ¿Como modificar el ancho de mi blog?

  • Hola buenos días.

    ¿Alguien sabría decirme como debo hacer para modificar el ancho de mi blog? es decir, donde aparecen los post en la página principal esta limitada la anchura, quisiera que llegara casi al final de la página. No consigo encontrar esta función. Mi blog es http://victorsnk.com/blogsnk

    Adjunto el código de mi Stylesheet.:
    ¡Muchas gracias por la ayuda!

    /*
    Theme Name: Wiredrive Classic
    Theme URI: http://www.wiredrive.com/customercare/wiredrive-classic-theme-for-wordpress-websites/
    Author: Wiredrive, Drew Baker, Daniel Bondurant
    Author URI: http://www.victorsnk.com/blosnk
    License: GNU General Public License
    License URI: license.txt

    Tags: fixed-width, custom-colors, custom-header, custom-background, theme-options
    */

    /* Globals */
    html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    }

    body {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 12px;
    color: #999;
    line-height: 1.4;
    background-image: url(images/background.gif);
    }

    img {
    border: none;
    }

    /* Links */
    a {
    color: #000;
    text-decoration: none;
    outline: none;
    }
    a:hover {
    color: #fff;
    text-decoration: underline;
    }
    a:active {
    outline: none;
    }
    .nav a {
    color: #888;
    text-decoration: none;
    }
    .top-nav a {
    color: white;
    }
    .nav .children a {
    color: #ffffff;
    }
    .entry a.post-edit-link {
    float: left;
    clear: both;
    width: 100%;
    margin: 20px 0;
    font-size: 10px;
    }

    /* Page Structure */
    #container {
    min-height: 100%;
    margin: 0 auto;
    position: relative;
    width: 1000px;
    }
    #header {
    position: relative;
    }
    #sidebar {
    width: 200px;
    float: left;
    margin: 0 9px 20px 25px;
    }
    .content-wrapper {
    padding: 40px 20px 80px 20px;
    overflow: hidden;
    }
    #footer-wrapper {
    height: 60px;
    position: absolute;
    bottom: 0;
    width: 100%;
    overflow: hidden;
    }
    #footer {
    padding: 0 20px;
    }

    /* Header */
    #logo {
    max-width: 320px;
    float: left;
    }
    #logo a {
    display: block;
    }
    .title {
    width: 460px;
    text-align: right;
    position: absolute;
    bottom: 0;
    right: 0;
    margin-right: 20px;
    }
    .title h2 {
    padding: 0;
    margin: 0;
    font-size: 24px;
    }

    /* Indervidual Page Styles */
    .pagepost {
    float: right;
    width: 100%;
    }
    .entry {
    overflow: hidden;
    }
    .entry p:first-child {
    margin-top: 0;
    }

    /* Protected Forms */
    .entry input {
    margin: 3px 0;
    }

    /* Footer */
    .footer-content {
    width: 830px;
    float: left;
    }
    /* Social Links */
    .social-links {
    float: right;
    margin-top: 20px;
    }
    .social-links a {
    display: inline-block;
    height: 24px;
    width: 24px;
    margin: 0 0 0 10px;
    }
    .social-links span {
    display: none;
    }
    .twitter {
    background: url(images/icon-twitter.png);
    }
    .facebook {
    background: url(images/icon-facebook.png);
    }

    /* Blog Styles */
    .blog .post {
    margin-top: 30px;
    padding-top: 30px;
    }
    .blog .post:first-child {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
    }
    .pagepost .post-title {
    display: block;
    margin: 0;
    }
    .blog-nav {
    margin-top: 20px;
    }
    .prev-posts {
    float: left;
    }
    .next-posts {
    float: right;
    }
    .metalinks {
    font-size: 11px;
    margin: 5px 0 15px 0;
    clear: both;
    }
    .metalinks .by {
    margin: 0;
    }
    .metalinks .date {
    margin: 0;
    }
    .metalinks .comment_bubble {
    background: url(images/icon-comment.png) no-repeat center left;
    padding: 0 0 2px 19px;
    text-decoration: none;
    }
    .sticky {
    background: #EEEEEE;
    border-top: 3px solid #DDDDDD;
    border-bottom: 3px solid #DDDDDD;
    padding: 20px 0;
    }

    /* Menu’s and Navigation */
    /* This is for the main site wide menu */
    ul.nav {
    margin: 0 0 10px 0;
    padding: 0;
    font-size: 14px;
    }
    ul.nav li, ul.nav li ul {
    list-style: none;
    margin: 0;
    padding: 0;
    }
    .nav ul.children, .nav ul.sub-menu {
    padding: 0;
    overflow: hidden;
    display: none;
    }
    .nav ul.children li {
    margin: 0;
    padding: 0;
    }
    .nav ul.children li a, .nav ul.sub-menu li a {
    padding-left: 10px;
    }
    /* This is for the top drop down menus */
    .top.menu {
    margin: 0 20px 0 0;
    padding: 0;
    right: 0;
    top: 50%;
    position: absolute;
    width: 650px;
    text-align: right;
    }
    .top.menu ul, .top.menu li {
    float: left;
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative;
    }
    .top.menu ul {
    float: right;
    }
    .top.menu li a {
    text-decoration: none;
    float: left;
    }
    .top.menu > ul > li {
    margin-left: 20px;
    }
    .top.menu ul.sub-menu, .top.menu ul.children {
    z-index: 10;
    opacity: .95;
    white-space: nowrap;
    overflow: hidden;
    float: left;
    clear: left;
    position: absolute;
    top: 100%;
    padding: 10px;
    margin-left: -10px;
    display: none;
    z-index: 999;
    }
    .top.menu .sub-menu li, .top.menu .children li {
    text-align: left;
    clear: left;
    float: left;
    }
    .top.menu .sub-menu li a, .top.menu .children li a {
    padding-left: 0;

    }
    /* This is for the top nav on the indervidual pages */
    ul.sub-nav {
    margin: 0;
    width: 400px;
    overflow: auto;
    font-size: 14px;
    font-weight: 700;
    text-align: right;
    float: right;
    }
    ul.sub-nav li {
    margin: 0 15px 0 0;
    padding: 0;
    color: white;
    display: inline-block;
    }
    ul.sub-nav li:last-child {
    margin: 0;
    }

    /* Comments */
    #comments {
    margin-top: 40px;
    padding-top: 40px;
    text-transform: uppercase;
    }
    #comment {
    width: 98%;
    }
    ul.commentlist {
    margin-left: 0;
    padding-left: 0;
    }
    ul.commentlist > li {
    list-style: none;
    margin-bottom: 20px;
    padding-bottom: 20px;
    }
    .comment-author .avatar {
    float: left;
    margin-right: 20px;
    }
    .comment-body .reply {
    text-align: right;
    }
    ul.commentlist ul.children {
    list-style: none;
    }
    ul.commentlist ul.children li {
    margin-top: 20px;
    padding-top: 20px;
    }
    #reply-title {
    text-transform: uppercase;
    }
    .bypostauthor{
    padding: 10px 0;
    }
    .form-allowed-tags {
    font-size: 10px;
    }

    /* Widgets */
    .nav li.widget {
    margin: 10px 0;
    display: block;
    }
    .widgettitle {
    margin: 0;
    text-transform: uppercase;
    font-size: 14px;
    }

    /* Wiredrive Player Overides */
    body .wd-player.popup ul.wd-thumb-list li {
    margin: 0 3px 3px 0;
    width: 178px;
    }
    body .wd-player.popup .wd-thumb {
    width: 178px;
    height: auto;
    }
    body .wd-player.popup.box-thumbs .wd-thumb {
    width: auto;
    height: auto;
    }
    /* WordPress Required */
    #tagline {
    display: none;
    }
    .aligncenter, div.aligncenter {
    display: block;
    margin-left: auto;
    margin-right: auto;
    }
    img.aligncenter {
    padding: 10px;
    }
    .alignleft {
    float: left;
    }
    img.alignleft {
    margin: 0 10px 0 0;
    }
    .alignright {
    float: right;
    }
    img.alignright {
    margin: 0 0 0 10px;
    }
    .gallery-caption {
    text-align: center;
    }
    .wp-caption {
    background-color: #f3f3f3;
    border: 1px solid #ddd;
    -khtml-border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px; /* optional rounded corners for browsers that support it */
    margin: 10px;
    padding-top: 4px;
    text-align: center;
    }
    .wp-caption img {
    border: 0 none;
    margin: 0;
    padding: 0;
    }
    .wp-caption p.wp-caption-text {
    font-size: 11px;
    line-height: 17px;
    margin: 0;
    padding: 0 4px 5px;
    }

Viendo 5 respuestas - de la 1 a la 5 (de un total de 5)
  • Hola victor en el style.css puedes modificar de esta manera

    Ancho de toda la pagina:

    /* Page Structure */
    #container {
    min-height: 100%;
    margin: 0 auto;
    position: relative;
    width: 1000px; <—–(Medida de todo el ancho de la pagina)
    }

    Para ancho del header

    #logo {
    max-width: 320px; <—– ancho del Logo
    float: left;
    }
    #logo a {
    display: block;
    }
    .title {
    width: 460px; <——ancho del titulo de pagina
    text-align: right;
    position: absolute;
    bottom: 0;
    right: 0;
    margin-right: 20px; <—– margenes del titulo
    }

    Aqui puedes mover el content de las entradas y pagina
    .content-wrapper {
    padding: 40px 20px 80px 20px; <– juega con20 a cualquier valor
    overflow: hidden;

    Espero te sirva de ayuda.
    Saludos

    Iniciador del debate victorsnkweb

    (@victorsnkweb)

    Si, me sirvio! mil gracias, pero me encuentro con otro problema, resulta que no es por el ancho de post, si no porque el tema tiene margenes tal y como muestra esta imagen, ¿tienes idea de como puedo hacer el blog a pantalla completa sin los margenes laterales o en este caso el de la derecha?

    GRACIAS POR TU AYUDA DE VERDAD

    Mmm no se intenta ver con chrome o con explorer a mi no me sale ese espacio aqui una captura de pantalla con los 2 navegadores, quiza sea el firefox. Ahi no se el problema intenta con otro navegador y me enselas una captura de imagen
    http://www.fileden.com/files/2008/10/26/2160744/mainpage3.jpg

    Quiza alguien mas pueda ayudarte ten paciencia
    Saludos

    Iniciador del debate victorsnkweb

    (@victorsnkweb)

    Hola, no podéis verlo porque tengo el backgrpund de color blanco pero al poner color me ocurre lo de la imagen de arriba. Es un tema de aumentar el máximo de la paf
    Página. Muchas gracias por la ayuda, haber si me ayudáis a resolver esto, gracias

    Hola victor, la verdad no se ya que tendria que instalar el thema en uno de mis blogs y experimentar, pero creeme a mi no me sale eso que dices en la imagen anterior vi un espacio rosado del lado derecho pero en mis navegadores no sale nada, hoy fui a tu pagina y esta demasiado ancha, ¿le has cambiado al ancho de la pagina o algo?, para ayudarte mejor ya que veo que tu pagina tiene un diseño sencillo te puedo recomendar un theme que es dinamico es decir que tiene un panel para configurarlo todo, ancho del contenido del post, ancho de los widgets, los margenes, colores de links, colores de texto, colores del titulo, en fin creo que este es el mas practico, en unos 20 minutos tendras el thema como el que tienes y sin ese problema ya que es un camaleon de themas, me refiero a que imita a cualquier theme con su panel y no tener que buscar y experimentar en el style.css. Se llama weaver es muy bueno y es facil sin codigos http://wordpress.org/extend/themes/weaver
    Disculpa

Viendo 5 respuestas - de la 1 a la 5 (de un total de 5)
  • El debate ‘¿Como modificar el ancho de mi blog?’ está cerrado a nuevas respuestas.