-
Cómo editar Temas de WordPress en Dreamweaver CS5
-
WordPress ofrece una de las plataformas de gestión de contenidos en línea más personalizables disponibles de forma gratuita. Edición de temas con el fin de dar un diseño de su propio diseño gráfico, o para mejorar la funcionalidad mediante la adición de secuencias de comandos o plugins pueden mejorar aún más las capacidades básicas de un tema de WordPress. WordPress viene con su propio editor de temas disponibles a través del panel de administración; Sin embargo, es posible que prefiera para editar un tema utilizando el editor HTML de Dreamweaver de Adobe con el fin de obtener un mayor control sobre el proceso de diseño. ¿Cómo usted va sobre la edición de los archivos dependerá de cómo usted está familiarizado con las plantillas de WordPress y si necesita ver el diseño en la vista Diseño a medida que avanza.Instrucciones
Edición de código Sólo
1 Descargar el tema de WordPress que desea personalizar y almacenarlo en alguna parte que es fácil de localizar. La carpeta de temas tendrá múltiples archivos PHP en el interior que componen el diseño principal, que requiere un header.php, index.php, footer.php, page.php y single.php en un mínimo. Además de estos archivos, un tema también contendrá al menos una hoja de estilo, o un archivo style.css, que controla el aspecto de los elementos de diseño. Scripts, imágenes y carpetas de archivos incluidos también pueden estar presentes en su tema.
2 Lanzar Dreamweaver y haga clic en "Abrir". Vaya a la ubicación de su tema de WordPress y abrirlo. Seleccione el header.php y haga clic en "Abrir". El archivo header.php contiene el tercio superior de su diseño de página. La cabecera contendrá siempre el <head> del HTML y la apertura <body>. En este archivo se puede agregar secuencias de comandos, enlaces a archivos CSS, jQuery iniciaciones, o meta tags.
3 Repita el paso 2 para abrir los archivos index.php y footer.php. El index.php contiene el área de contenido por defecto de la distribución del tema, incluyendo el "bucle" que enumera las entradas del blog. A menos que una plantilla de página especial se llama, WordPress siempre será por defecto el index.php. El footer.php contiene el área de pie de página, que puede contener una barra de widgets horizontal, o nada más que un aviso de copyright y menú de la página. El pie de página debe contener siempre el cierre </ body> y </ html>.
4 Abrir style.css del tema. Este nombre de archivo no debe ser cambiado, como WordPress está configurado para buscar un "style.css" para identificar el tema en el menú Apariencia del panel de administración. Este archivo contiene el nombre y el autor del tema, así como de todos los estilos. Algunos temas pueden enlazar a otras hojas de estilo en lugar de colocar todo el CSS en un solo documento. Si ese es el caso para su tema, tendrá que abrir y editar dichas hojas de estilo adicionales.
5 Abra el archivo functions.php. Añadir las funciones adicionales, tales como barras laterales, plugins, o códigos cortos al final del archivo. Mantenga un ojo en el contador de línea a la izquierda. Si una línea se vuelve roja, significa que ha formado incorrectamente una llamada a la función o perdido una coma o punto y coma.
Código y Diseño
6 Haga clic en "Archivo" y "Nuevo" y crear un nuevo documento HTML. Haga clic en el botón "código" para entrar en la vista de edición de código. Pegar el código siguiente en el archivo:
<! - Cabecera Inicio ->
<! - Header End ->
<! - Inicio Contenido ->
<! - End Contenido ->
<! - Sidebar ->
<! - Fin barra lateral ->
<! - Inicio de pie de página ->
<! - Fin de pie de página ->
Esto le ayudará a dividir su disposición para que pueda reconstruir fácilmente sus archivos PHP más tarde.
7 Pegar el contenido del archivo header.php entre la "Cabecera Inicio" y "Fin comentarios de cabecera". Repita este proceso para pegar el contenido de index.php en el área de contenido, sidebar.php - si lo hay - en el área de la barra lateral y footer.php en el área de pie de página.
8 Retire las etiquetas de plantilla desde el área de cabecera con el fin de obtener el código JavaScript y hojas de estilo para detectar adecuadamente, lo que permite ver el diseño de la disposición. etiquetas de plantilla se verá como "<? php bloginfo ( 'template_directory');?>" y la eliminación de ellos pueden requerir además que quitar la barra justo después de la etiqueta. Arreglar cualquier caminos necesarios y haga clic en el botón "Split" para ver el diseño final. Editar la plantilla como lo haría con cualquier diseño de página web HTML normales.
9 Vuelva a colocar las rutas de archivos completos a cualquier script o hojas de estilo con la etiqueta plantilla de WordPress, una vez que haya terminado de editar el diseño. sustituir también funciones tales como su menú de navegación o widgets de la barra lateral con las etiquetas de plantillas adecuadas. Ver el Codex de WordPress para obtener una lista completa de los códigos de plantilla disponibles o se refieren a los archivos PHP originales para copiarlos.
10 Copiar cada sección del código editado de nuevo en sus archivos PHP separados. Asegúrese de que su index.php incluye el "get_header" y "etiquetas de plantilla get_footer". Sube el tema de la instalación de WordPress y probarlo mediante la activación a través del menú Apariencia. Se pueden hacer a pequeños ajustes adicionales editando directamente el tema en "Apariencia" y "Editor".
Consejos y advertencias
- Puede utilizar la opción "Inspeccionar elemento" en el menú del botón derecho de Opera, también disponible en Firefox con el "Firebug" complemento instalado, para ver cuál de etiquetas y estilos CSS utiliza un área específica de un tema en vivo. Esto ayuda a personalizar los colores y las imágenes del tema mucho más rápido que la lectura del código por sí sola.
- Explorar carpeta "Imágenes" del tema con un programa de edición gráfica, o con "Miniaturas grandes" habilitado en el Explorador de Windows, para tener una idea de que las imágenes se están referenciados por una declaración CSS particular.
- No quite las etiquetas de plantillas de WordPress PHP en sus archivos de tema. WordPress necesita estas etiquetas de plantilla con el fin de tirar de una funcionalidad específica en el tema. Para obtener más información, visite la página de la plantilla del Codex de WordPress.
