image - tamaño - Navegación de WordPress con imágenes

tamaño de imagenes en wordpress

Question

Estoy trabajando en un sitio de WordPress en este momento. Todo está bien, excepto mi navegación. No quiero utilizar el texto estándar y la navegación basada en css que usa WordPress, pero inserto mi propia navegación con imágenes gráficas (archivos PNG, aunque puedo cambiar el tipo de archivo si es necesario).

¿Alguien sabe de algún tipo de complemento para WordPress que le permite tener imágenes en lugar de texto en la navegación?

Saludos, Nader

Answer 1

¿Quieres tener tu propio archivo css? si es así puedes usar esto para decir a wordpress usa tu propio archivo css:

wp_enqueue_style( $handle, $src, $deps, $ver, $media );

ejemplo:

<?php

    /*
     * This example will work with WordPress 2.7
     */

    /*
     * register with hook ''wp_print_styles''
     */
    add_action(''wp_print_styles'', ''add_my_stylesheet'');

    /*
     * Enqueue style-file, if it exists.
     */

    function add_my_stylesheet() {
        $myStyleUrl = plugins_url(''style.css'', __FILE__); // Respects SSL, Style.css is relative to the current file
        $myStyleFile = WP_PLUGIN_DIR . ''/myPlugin/style.css'';
        if ( file_exists($myStyleFile) ) {
            wp_register_style(''myStyleSheets'', $myStyleUrl);
            wp_enqueue_style( ''myStyleSheets'');
        }
    }

?>

Answer 2

Cambiar la salida de la barra de navegación requiere diseñar la salida de la función wp_navmenu (). Puedes ver esa salida con Firebug. Esto se verá algo así como:

<li id="menu-item-689" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-689">
    <a href="#">Categories</a>
</li>

Oriente el ID o la clase con una imagen de fondo y, opcionalmente, oculte el texto del menú. La forma recomendada de hacerlo es con el archivo style.css en un tema secundario. No te metas con los archivos de los padres. Solo importelos en un nuevo archivo style.css. Verifique el códice para crear temas infantiles .

Pruebe algo como esto:

#menu-item-689{
    background-image: url(''whatever.img'');
    margin: -999em;
    font-size: 0;
}

no use display:none porque quiere que los lectores de pantalla lo lean. Otro método consiste en establecer el posicionamiento en absoluto para la lista como un todo y configurar la left: -999em .