How to change logo on wordpress

New Page saltar al content

  • Launch session
  • Register

WordPress.org

  • News
  • Download and Extend
    • Get WordPress
    • Themes
    • Patrons
    • Complements
    • open back
    • Movil
    • Alojamiento
  • Apprentice
    • Learn WordPress
    • Apoyo
    • Forums
    • WordPress.tv
    • Desarrolladores
  • Community
    • Access WordPress
    • Campamento de palabras
    • meetings
    • Photo Directory
    • Bolsa de trabajo
    • Cinco for the future
  • sober
    • Access WordPress
    • To escape
    • Gutenberg
    • Company
  • Get WordPress

Busqueda

Get WordPress

Menu

Recursos para desarrolladores

Chapters

  • Empezando

    • ¿Quién debe leer este manual?
    • What is a theme?
    • WordPress and GPL Licenses
    • Configuration of a desarrollo entorno
    • Examples of theme development
  • Basic theme concepts

    • Theme features
    • Plantilla Archives
    • Main Style Hoja (style.css)
    • Post Types
    • Organization of theme archives
    • Jerarquía of plantillas
    • Include CSS and JavaScript
    • Categories, tags and custom taxonomies
    • Herramientas y recursos
  • Bloquear temas

    • Configuración del tema del bloque
    • Plantillas y partes de plantillas
    • Tema.json
    • Convertir un tema clásico en un tema de bloque

      • Convertir la configuración del personalizador en patrones de bloques
    • Crear nuevos temas usando el Editor del sitio
    • internacionalización
    • Accessibility
  • Classic themes

    • Your First Theme
    • Linking Theme Files & Directories
    • The Loop
    • Template Files Section

      • Publicar plantillas
      • Plantillas de página
      • Archivos de plantilla de adjuntos
      • Archivos de plantilla de tipo de publicación personalizada
      • Archivos de plantilla parciales y misceláneos

        • Plantilla de comentario
      • Plantillas de taxonomía
      • 404 páginas
    • Conditional Tags
    • Template Tags
    • Theme Functionality

      • Core-Supported Features

        • Administration Menus
        • Custom Headers
        • Custom Logo
        • Post Formats
        • Sticky Posts
      • Sidebars
      • Widgets
      • Navigation Menus
      • Pagination
      • Media

        • Audio
        • Imágenes
        • galerías
        • Video
      • Featured Images & Post Thumbnails
      • Internationalization
      • Localization
      • Accessibility
    • Theme Options – The Customizer API

      • Objetos del personalizador
      • Herramientas para mejorar la experiencia del usuario
      • La API de JavaScript del personalizador
      • JavaScript/Underscore.js: controles personalizados renderizados
      • Uso avanzado
  • Theme Security

    • Data Sanitization/Escaping
    • Data Validation
    • Using Nonces
    • Common Vulnerabilities
  • Theme Privacy
  • Advanced Theme Topics

    • Child Themes
    • UI Best Practices
    • JavaScript Best Practices
    • Theme Testing
    • Validating Your Theme
    • Plugin API Hooks
    • Block patterns
  • Releasing Your Theme

    • Required Theme Files
    • Testing
    • Theme Review Guidelines
    • Writing Documentation
    • Submitting Your Theme to WordPress.org
    • Updating Your Theme
  • References

    • List of Template Tags
    • List of Conditional Tags
  • Credits
  • Feedback

Browse: Home / Theme Handbook / Theme Functionality / Custom Logo

Topics

  • Qu’est-ce qu’un logo personnalisé ?
    • Ajout de la prise en charge du logo personnalisé à votre thème
    • Afficher le logo personnalisé dans votre thème
    • Balises de modèle de logo personnalisé

Qu’est-ce qu’un logo personnalisé ?

L’utilisation d’un logo personnalisé permet aux propriétaires de sites de télécharger une image pour leur site Web, qui peut être placée en haut de leur site Web. Il peut être téléchargé depuis Appearance > Header , dans votre panneau d’administration. La prise en charge du logo personnalisé doit d’abord être ajoutée à votre thème à l’aide de add_theme_support(), puis être appelée dans votre thème à l’aide de the_custom_logo(). Un logo personnalisé est facultatif , mais les auteurs de thèmes doivent utiliser cette fonction s’ils incluent un logo dans leur thème.

Haut ↑

Ajout de la prise en charge du logo personnalisé à votre thème

Pour activer l’utilisation d’un logo personnalisé dans votre thème, ajoutez ce qui suit à votre fichier functions.php :

add_theme_support(‘custom-logo’);

When enabling custom logo support, you can configure five parameters by passing arguments to the add_theme_support() function using an array:

function themename_custom_logo_setup() { $defaults = array( ‘height’ => 100, ‘width’ => 400, ‘flex-height’ => true, ‘flex-width’ => true, ‘header-text’ => array ( ‘site-title’, ‘site-description’ ), ‘unlink-homepage-logo’ => true, ); add_theme_support( ‘custom-logo’, $defaults ); } add_action( ‘after_setup_theme’, ‘themename_custom_logo_setup’ );

The after_setup_theme hook is used for custom logo support to be registered after the theme is loaded.

  • height Expected logo height in pixels. A custom logo can also use built-in image sizes, such as thumbnail, or register a custom size using add_image_size().
  • width Expected logo width in pixels. A custom logo can also use built-in image sizes, such as thumbnail, or register a custom size using add_image_size().
  • flex-height Whether to allow for a flexible height.
  • flex-width Whether to allow for a flexible width.
  • header-text Classes(s) of elements to hide. It can pass an array of class names here for all elements constituting header text that could be replaced by a logo.
  • unlink-homepage-logo If the unlink-homepage-logo parameter is set to true, logo images inserted using get_custom_logo() or the_custom_logo() will no longer be linked to the homepage when visitors are on this page. In an effort to maintain the style given to the linked image, the unlinked logo image is inside a span tag with the same “custom-logo-link” class.

Top ↑

Display custom logo in your theme

A custom logo can be displayed in the theme using the _custom_logo() function. But it is recommended to wrap the code in a function_exists() call to maintain backwards compatibility with older versions of WordPress, like this:

if ( function_exists( ‘the_custom_logo’ ) ) { the_custom_logo(); }

Generally, logos are added to the theme’s header.php file, but it can also be elsewhere.

If you want to get your current logo URL (or use your own markup) instead of the default markup, you can use the following code:

$id_personalized_logo = get_theme_mod(‘personalized_logo’); $logo = wp_get_attachment_image_src($custom_logo_id, ‘full’); if (has_custom_logo()) { echo ‘<img src=”‘.esc_url($logo[0]).'” alt=”‘.get_bloginfo(‘name’).'”>’; } else { echo ‘<h1>’ . get_bloginfo(‘name’) . ‘</h1>’; }

Top ↑

Custom logo template tags

To manage the display of a custom logo in the front-end, these three template tags can be used:

  • get_custom_logo() – Returns markup for a custom logo.
  • the_custom_logo() – Displays markup for a custom logo.
  • has_custom_logo() – Returns a boolean true/false whether a custom logo is defined or not.

 

Navigation in the manual

← Custom Header Post Formats →

  • About
  • New
  • Accommodation
  • Make a donation
  • Support
  • Developers
  • To be involved
  • Learn
  • Showcase
  • plugins
  • Themes
  • Grounds
  • WordCamp
  • WordPress.TV
  • buddy press
  • bbPress
  • WordPress.com
  • Mast
  • Privacy
  • public code
  • Visit our Facebook page
  • Visit our Twitter account
  • Visit our Instagram account
  • Visit our LinkedIn account

The code is poetry g

Notice

How to Add a Custom Logo to Your Site Header

Harper Phillips

Harper Phillips / Updated: September 18, 2022

Posted in: Quick Guides Difficulty: Beginner

Ajouter un logo personnalisé à l’en-tête de votre site est l’une des toutes premières choses que vous voudrez probablement faire après avoir configuré votre site sur votre nouvel hébergeur et installé un thème que vous aimez. Heureusement, c’est aussi l’une des choses les plus simples que vous puissiez faire dans WordPress. Voici comment y parvenir :

  1. Connectez-vous à votre tableau de bord WordPress.

    (Click to enlarge)

    (Cliquez pour agrandir)

  2. Sélectionnez “Personnaliser” dans le menu déroulant sous “Apparence”.

    (Click to enlarge) (Click to enlarge)

    (Cliquez pour agrandir)

  3. Select the menu option for “Header” or “Logo” settings. The options available in the customizer are not standard throughout WordPress and are determined by the theme developer. You might have to search a bit to find section in your theme that allows for customizations. Here are a couple examples of what you’re looking for:

    (Click to enlarge) (Click to enlarge)

    (click to enlarge)

    (Click to enlarge) (Click to enlarge)

    (click to enlarge)

  4. Once you’ve found the area that controls your header, click “Select Image”.

    (Click to enlarge) (Click to enlarge)

    (click to enlarge)

  5. Click “Select Files” to upload the image file you want to use as your header logo. Then click “Choose Image”.

    (Click to enlarge) (Click to enlarge)

    (click to enlarge)

  6. Once you have a logo that looks the way you want it to in the preview to the right, click “Save” and that’s it!

    (Click to enlarge) (Click to enlarge)

    (click to enlarge)

     

This guide will show you how to add your site logo. Don’t have a logo yet? We’ve partnered with Fiverr to help you create one.

Table of Contents

  1. Add Your Logo in the Site Editor
  2. Add Your Site Logo in the Customizer
  3. Create a Logo with Fiverr Logo
  4. Hiding the Site Title and Description
  5. Theme Support

Add Your Logo in the Site Editor

If you don’t see Appearance → Customize in your dashboard, that means your site uses the Site Editor. To add your logo, go to Appearance → Site Editor and add the Site Logo block instead.

↑ Table of Contents ↑

Add Your Site Logo in the Customizer

To add your logo, follow these steps:

  1. Go to Appearance → Customize and click on the Site Identity section.
  2. Click Select logo to open your site’s Media.
  3. Upload a new image, or select one that’s already in your Media.
  4. Haga clic en Establecer como logotipo y verá que su logotipo aparece en la ventana de vista previa.
  5. Haga clic en el botón Guardar cambios en la parte superior derecha para activar el logotipo en su sitio.

select-logo

↑ Table of Contents ↑

Crear un logotipo con el logotipo de Fiverr

WordPress.com se ha asociado con Fiverr para facilitarle la creación de un logotipo impresionante en solo segundos. Fiverr permite que cualquier persona obtenga un diseño de calidad profesional rápidamente a un precio asequible. Para empezar:

  1. Vaya a Apariencia →  Personalizar y haga clic en la sección Identidad del sitio  .
  2. Haz clic en Crear logotipo para ir al sitio web de Fiverr.
  3. Introduce el nombre de tu empresa o blog, así como un eslogan si lo tienes, y haz clic en Generar .
  4. Fiverr creará logotipos automáticamente para que los veas y los personalices. Puede personalizar fácilmente el color, la fuente, el tamaño de fuente, el espaciado, el posicionamiento y más.
  5. Después de comprar su logotipo, puede descargarlo.
  6. Siga los pasos descritos en la sección Agregar el logotipo de su sitio anterior.

create-logo

↑ Table of Contents ↑

Ocultar el título y la descripción del sitio

Una vez que tenga un logotipo, es posible que no necesite su tema para mostrar el título de su sitio en texto normal. ¡Pero los títulos son buenos para el SEO! En lugar de dejar el título en blanco, puede ocultarlo: debajo de las herramientas del logotipo del sitio en el Personalizador, verá una casilla de verificación etiquetada Mostrar título y eslogan del sitio . Para ocultar el título y la descripción de su sitio, dejando solo el logotipo, desmarque esta casilla y luego haga clic en Guardar y publicar .

Display site title and tagline

↑ Table of Contents ↑

Soporte de temas

For all the compatible themes, consult the filter of the logotype of the site in the presentation of themes.

Versatile plans and pricing

  • Free

    plan-free-circle

    Best for students

  • Personal

    plan-personal-circle

    Best for hobbyists

  • Premium

    plan-premium-circle

    Best for freelancers

  • Business

    plan-business-circle

    Ideal for small businesses

Choose a package

g


Video How to change logo on wordpress

Related Posts

How to add seo keywords in wordpress

Contents1 Cómo agregar palabras clave de SEO en WordPress (aumentar el CTR y las clasificaciones)1.1 Post Title1.2 Headline1.3 Header Tags1.4 Introduction and Conclusion1.5 Body Copy1.6 URL1.7 Meta…

How to embed google calendar into wordpress

Contents1 How to Add a Google Calendar in WordPress (Step by Step)2 Add a Google calendar to your website3 calendario de Google3.1 Versatile plans and pricing4 Video…

How to change the logo in wordpress

Contents1 How to Add a Custom Logo to Your Site Header2 Site Logo2.1 Planes y precios versátiles3 Add, remove or edit a custom logo4 Video How to…

How to add a popup on wordpress

Contents1 Easily create a WordPress emergent form (2 forms)1.1 ¿Por qué usar un formulario emergente de WordPress?1.2 Método #1: Crear un formulario emergente con OptinMonster + WPForms1.3…

How to roll back wordpress version

Contents1 How to Revert WordPress: Undo WordPress Updates (Easy Way)2 How to Downgrade WordPress & Roll Back to a Previous Version2.1 1. A WordPress update included significant changes…

How to rollback wordpress version

Contents1 How to Downgrade WordPress and Revert to an Older Version1.1 1. A WordPress update included significant changes that are not compatible with your theme or plugins1.2…