This is a plugin for WordPress which disables the upper admin area in the font side and just displays a […]
Showing posts from Tag: css
show all posts
Development and implementation of a Web GIS component which consumes a predefined API.
Add the following code to your theme’s functions.php file:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 |
/* * Show the thumbnail and the title of a WP post with bootstrap media */ // Add the shortcode add_shortcode('show_post_wp_bm', 'get_post_title_and_thumbnail_in_boostrap_media'); // Create the function if(!function_exists('get_post_title_and_thumbnail_in_boostrap_media')): function get_post_title_and_thumbnail_in_boostrap_media($atts, $content=null) { // Get the attributes provided extract(shortcode_atts(array( "id" => null ), $atts)); // Check if an id was specified and that the post with that id exists if (is_numeric($id)) { $post = get_post($id); } // Get the data if ($post != null) { $title = apply_filters ( 'wp_title', $post->post_title); $html = ''; $html .= '<div class="media">'; $html .= '<div class="media-left media-middle">'; $html .= '<a href="'.get_permalink($post).'" title="'.$title.'">'; $html .= get_the_post_thumbnail($post, 'thumbnail'); $html .= '</a>'; $html .= '</div>'; $html .= '<div class="media-body">'; $html .= '<a href="'.get_permalink($post).'" title="'.$title.'">'; $html .= '<h4 class="media-heading">'.$title.'</h4>'; $html .= '</a>'; //$html .= '...'; $html .= '</div>'; $html .= '</div>'; // Return the content return html_entity_decode($html); } // Return an error return '[show_post_wp_bm] Invalid ID: ' . $id; } endif; |
Add the following code to your theme’s functions.php file:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
// Categories walker class Walker_Categories_Template extends Walker_Category { function start_lvl(&$output, $depth=1, $args=array()) { $output .= "\n<ul class=\"list-group\">\n"; } function end_lvl(&$output, $depth=0, $args=array()) { $output .= "</ul>\n"; } function start_el(&$output, $item, $depth=0, $args=array()) { $output .= "<li class=\"list-group-item\"><a href=\"". esc_url( get_category_link( $item->term_id ) ) ."\" title=\"".esc_attr( $item->name )."\"><span class=\"badge pull-right\">".esc_attr($item->count)."</span>".esc_attr( $item->name ); } function end_el(&$output, $item, $depth=0, $args=array()) { $output .= "</a></li>\n"; } } |
Use the categories list function like this:
|
1 2 3 |
<?php wp_list_categories( array( 'walker'=> new Walker_Categories_Template ) ); ?> |
dragonet.js is basicly a wrapper for hooks added on html elements. The main idea is that the list of hooks […]
Use the following code to remove the dotted outline around a link:
|
1 2 3 |
a, a:hover, a:active, a:focus { outline: 0; } |
Source: Removing The Dotted Outline
Here is a useful and interesting tutorial: http://thenewcode.com/533/Sepia-toning-photographs-with-CSS
The code below will help you make Twitter’s Boostrap accordion widget as high as the column it is inserted in. […]
Use the following code to disable the navbar collapse in Twitter’s Bootstrap version 3.3.4:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 |
/*no collapse*/ .navbar-collapse.collapse.off { display: block!important; } .navbar-collapse.collapse.off ul { margin: 0; padding: 0; } .navbar-nav.no-collapse>li, .navbar-nav.no-collapse { float: left !important; } .navbar-right.no-collapse { float: right!important; } |
then add the .off class […]
The example below adds a tag to the bottom of the page. The CSS code is the following:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 |
/* Powered by - CSS tag */ .powered-by { margin: 0; padding: 0; position: absolute; right: 40px; bottom: 10px; list-style: none; } /* the link */ .powered-by a { float: left; height: 24px; line-height: 24px; position: relative; font-size: 11px; margin-left: 20px; padding: 0 10px 0 12px; background: #0089e0; color: #fff; text-decoration: none; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; border-bottom-right-radius: 4px; -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; border-top-right-radius: 4px; } /* The < */ .powered-by a:before { content: ""; float: left; position: absolute; top: 0; left: -12px; width: 0; height: 0; border-color: transparent #0089e0 transparent transparent; border-style: solid; border-width: 12px 12px 12px 0; } /* The * */ .powered-by a:after { content: ""; position: absolute; top: 10px; left: 0; float: left; width: 4px; height: 4px; -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; background: #fff; -moz-box-shadow: -1px -1px 2px #004977; -webkit-box-shadow: -1px -1px 2px #004977; box-shadow: -1px -1px 2px #004977; } /* Link specifics */ .powered-by a:hover { background: #555; } .powered-by a:hover:before { border-color: transparent #555 transparent transparent; } |
[…]
A fist version of my micro php 5 framework has been finally launched. You can access it at starfish.ml
This is a presentation website for a Water consulting company. It uses a one page template – rather each page […]