jueves, 14 de febrero de 2019

Wordpress - Crear plantilla

febrero 14, 2019 // by Alex // // No comments

Elementos básicos de una plantilla

1. Plantilla principal(index.php)
2. Hoja de estilos principal del tema(style.css)
3. Archivo de funciones del tema (functions.php)
4. Imagen de captura de pantalla del tema(screenshot.png)

index.php

HTML


<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<meta charset="<?php bloginfo('charset'); ?>">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title><?php wp_title('|',true,'right'); ?></title>
<?php wp_head(); ?>
</head>
<body>
<header class="Header">
<div class="Logo">
<a href="#">Logo</a>
</div>
<nav class="Menu">
<ul>
<li><a href="#">Sección 1</a></li>
<li><a href="#">Sección 2</a></li>
<li><a href="#">Sección 3</a></li>
<li><a href="#">Sección 4</a></li>
<li><a href="#">Sección 5</a></li>
</ul>
</nav>
</header>
<main class="Main">
<article class="Content">
<h2>Contenido</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nobis quo facilis repellat molestias explicabo nulla vitae perspiciatis eligendi reprehenderit, deleniti sit, error voluptas. Voluptate et, libero ipsa praesentium eum, dolore!</p>
</article>
<aside class="Sidebar">
<h2>Sidebar</h2>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit. Error minima et, iusto molestias necessitatibus, itaque, veniam voluptatum eaque consequatur officia quidem. Reiciendis vel alias ducimus quibusdam dolores molestiae accusamus. Officia.</p>
</aside>
</main>
<footer>
<nav class="SocialMedia">
<ul>
<li><a href="">Redes 1</a></li>
<li><a href="">Redes 2</a></li>
<li><a href="">Redes 3</a></li>
<li><a href="">Redes 4</a></li>
<li><a href="">Redes 5</a></li>
</ul>
</nav>
<small>©2018 por @Alex Muñoz</small>
</footer>
<?php wp_footer(); ?>
</body>
</html>

style.css

CSS

/*!
Theme Name: Shacker WP Theme
Theme URI:https://maximo2014.blogspot.com/
Author: Alex Muñoz
Author URI:https://maximo2014.blogspot.com/
Description: Plantilla generica de pruebas
Version: 1.0.0
License: GNU General Public License v2 or later
License URI:http://www.gnu.org/licenses/gpl-2.0.html
Tags: one-column, two-columns, right-sidebar, flexible-header
*/

functions.php

PHP

<?php /**
* My Awesone Wordpress teme functions and definitions
*
* @link https://developers.wordpress.org/themes/basic/theme-functions/
*
* @package Wordpress
* @subpackage Shack
* @since 1.0.0
* @version 1.0.0
*/

// SE AGREGA LA HOJA STYLE.CSS
add_action( 'wp_enqueue_scripts', 'custom_enqueue_styles');

function custom_enqueue_styles() {
wp_enqueue_style( 'custom-style',
get_stylesheet_directory_uri() . '/style.css',
array(),
wp_get_theme()->get('Version')
);
}


// AGREGAR FUENTE DE GOOGLE-FONTS
if(!function_exists('shack_scripts')):
function shack_scripts(){
wp_register_style('google-fonts',
'https://fonts.googleapis.com/
css?family=Raleway:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i',array(),
'1.0.0','all');

wp_enqueue_style('google-fonts');
wp_enqueue_style('style');

}
endif;
add_action('wp_enqueue_scripts','shack_scripts');

0 comentarios:

Publicar un comentario