agosto182

WriteFreely es un proyecto hecho para la creacion de blogs o microblogs que federan en la red a traves de !ActivityPub. Su desarrollo esta muy apenas en el inicio. Aunque cabe destacar que ya federa bastante bien con la mayoria de redes sociales que soportan este protocolo.

El diseño de los blogs es bastante sencillo y plano. Pero esto es algo que puede resolverse facilmente.

WriteFreely es bastante sencillo de usar. Posee pocos botones que hacen su uso bastante fluido.

Esta nos ofrece un panel de “personalizacion” que podemos encontrar en la parte superior derecha en el boton “View blogs” o “Ver blogs”. Dentro de ahi veremos nuestros blogs.

Ahora solo hace falta situar el mouse encima del blog que queramos y aparecera la opcion “customization” o “personalizacion”.

Ahi tenemos un monton de opciones en las que podemos modificar nuestro blog. Si apenas estas iniciando tu blog te recomiendo activar tu blog como “Public” o “Publico” asi sera accesible para el fediverso.

Volviendo a la personalizacion. En la parte inferior podremos ver un recuadro en el que podemos agregar nuestro codigo CSS. Para las personas que somos mas viejas este recuadro es similar al que se usaba en la red social “MySpace” para personalizar tu perfil.

Ahora como personalizacion inicial podemos agregar este codigo a nuestro blog e ir cambiando algunos parametros:

/* Cuerpo del sitio */
body {
    background-color: #efefef;
}

/* Titulos y los posts */
#blog-title a { 
    color: #fff;
    background-color: #7a629d;
}
#blog-title a:hover { 
    color: #eee;
    background-color: #7a629d;
}

/* Descripcion del sitio */
header p.description {
    font-style: italic;
}

/* Titulos de los post */
.post-title {
    font-weight: normal;
}
.post-title a.u-url:link, .post-title a.u-url:visited {
    color: blue;
}

/* Link's 'ver mas' */
body#collection a.read-more {
    text-decoration: underline;
}

/* Links dentro de los posts */
article p a {
    color: #444;
    text-decoration: none;
    border-bottom: 2px solid orangered;
}
article p a:hover {
    background-color: orangered;
    color: white;
    text-decoration: none;
}

/*

    Otros
    Patrones comunes dentro de nuestro blog

*/

/* Centrar imagenes */
img {
    display: block;
    margin: 0 auto;
}

/* Desabilitar el efecto difuminado del titulo dentro de un post */
body#post header
    -moz-opacity: 1;
    -khtml-opacity: 1;
    -webkit-opacity: 1;
    opacity: 1;
}

Jugando con estos parametros podemos personalizar nuestro blog a como nosotros queramos. Podemos agregar mas codigo dentro de cada identificador, por lo que las posibilidades son casi infinitas.

Pueden hacerse cosas aun mas avanzadas, pero eso ya depende de la imaginacion y el diseño que desees tener.

— Ivan Agosto