Clases CSS en WordPress
-
Upload
cesar-jefferson-aquino-maximiliano -
Category
Technology
-
view
105 -
download
3
Transcript of Clases CSS en WordPress
![Page 1: Clases CSS en WordPress](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/1.jpg)
Clases CSS en WordPress
![Page 2: Clases CSS en WordPress](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/2.jpg)
César Aquino Maximiliano@cesjam7
+
![Page 3: Clases CSS en WordPress](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/3.jpg)
Clases CSS
.content .text {font-size: 1.4rem;margin-left: 12px;
}
![Page 4: Clases CSS en WordPress](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/4.jpg)
¿Clases CSS?¿WordPress?
![Page 5: Clases CSS en WordPress](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/5.jpg)
Clases que genera WordPress:
.home
.single-product
.search
.page-contact
.post-514
.menu-item-69
.status-publish
![Page 6: Clases CSS en WordPress](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/6.jpg)
Ya muy bonito, pero…
![Page 7: Clases CSS en WordPress](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/7.jpg)
Ya muy bonito, pero… ¿sirven?
![Page 8: Clases CSS en WordPress](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/8.jpg)
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](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/9.jpg)
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](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/10.jpg)
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](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/11.jpg)
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](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/12.jpg)
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](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/13.jpg)
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](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/14.jpg)
¿Y si jugamos con JavaScript y sus selectores CSS?
![Page 15: Clases CSS en WordPress](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/15.jpg)
¿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](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/16.jpg)
¿Y las clases del wp-admin?
![Page 17: Clases CSS en WordPress](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/17.jpg)
¿Y las clases del wp-admin?
![Page 18: Clases CSS en WordPress](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/18.jpg)
![Page 19: Clases CSS en WordPress](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/19.jpg)
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](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/20.jpg)
Gracias ;)
+ @cesjam7+ jovenred.com+ databomberos.com+ orange612.com+ speakerdeck.com/cesjam7
![Page 21: Clases CSS en WordPress](https://reader033.fdocuments.us/reader033/viewer/2022052603/55d0895bbb61ebeb188b45b9/html5/thumbnails/21.jpg)
Gracias ;)
+ @cesjam7+ jovenred.com+ databomberos.com+ orange612.com+ speakerdeck.com/cesjam7
PD: En caso de emergencias llamen al 116