21
Clases CSS en WordPress

Clases CSS en WordPress

Embed Size (px)

Citation preview

Page 1: Clases CSS en WordPress

Clases CSS en WordPress

Page 2: Clases CSS en WordPress

César Aquino Maximiliano@cesjam7

+

Page 3: Clases CSS en WordPress

Clases CSS

.content .text {font-size: 1.4rem;margin-left: 12px;

}

Page 4: Clases CSS en WordPress

¿Clases CSS?¿WordPress?

Page 5: Clases CSS en WordPress

Clases que genera WordPress:

.home

.single-product

.search

.page-contact

.post-514

.menu-item-69

.status-publish

Page 6: Clases CSS en WordPress

Ya muy bonito, pero…

Page 7: Clases CSS en WordPress

Ya muy bonito, pero… ¿sirven?

Page 8: Clases CSS en WordPress

body_class();

.archive

.search-no-results

.error404

.single-product

.page-contact

.logged-in

.admin-bar

http://codex.wordpress.org/Function_Reference/body_class

Page 9: Clases CSS en WordPress

archive.php

.post-type-archive-product {background: url(product.jpg);

}.post-type-archive-event {

background: url(event.jpg);}

http://codex.wordpress.org/Function_Reference/body_class

Page 10: Clases CSS en WordPress

post_class();

.post-610

.type-noticias

.has-post-thumbnail

.status-publish

.tag-futbol

.category-deporte

http://codex.wordpress.org/Function_Reference/post_class

Page 11: Clases CSS en WordPress

single.php

.type-noticias {padding-left: 50px;

}.type-noticias.has-post-thumbnail {

padding-left: 0px;}

http://codex.wordpress.org/Function_Reference/post_class

Page 12: Clases CSS en WordPress

wp_nav_menu();

.menu-item

.current-menu-item

.menu-item-has-children

.menu-item-666

.current-menu-parent

.menu-item-object-page

http://codex.wordpress.org/Function_Reference/wp_nav_menu

Page 13: Clases CSS en WordPress

header.php

.current-menu-item,

.current-menu-parent {background: #c00;

}

http://codex.wordpress.org/Function_Reference/wp_nav_menu

Page 14: Clases CSS en WordPress

¿Y si jugamos con JavaScript y sus selectores CSS?

Page 15: Clases CSS en WordPress

¿Y si jugamos con JavaScript y sus selectores CSS?

main.js

$(‘.menu-item-has-children ul’).addClass(‘menu-submenu’);

Page 16: Clases CSS en WordPress

¿Y las clases del wp-admin?

Page 17: Clases CSS en WordPress

¿Y las clases del wp-admin?

Page 18: Clases CSS en WordPress
Page 19: Clases CSS en WordPress

functions.phpfunction border_colors() { echo '<style type="text/css"> #categorydiv.postbox {

border: 1px solid #000;}

</style>';

add_action('admin_head', 'cborder_colors');

Page 20: Clases CSS en WordPress

Gracias ;)

+ @cesjam7+ jovenred.com+ databomberos.com+ orange612.com+ speakerdeck.com/cesjam7

Page 21: Clases CSS en WordPress

Gracias ;)

+ @cesjam7+ jovenred.com+ databomberos.com+ orange612.com+ speakerdeck.com/cesjam7

PD: En caso de emergencias llamen al 116