Mac: Clock and Calendar in Menu Bar

Terakhir diperbaharui: Kamis, 25 Agustus 2016 pukul 15:12
Tautan: http://darto.id/2h

MagiCal is a FREE menu-based clock and calendar. It features a huge range of configuration options for how the time and date are displayed, and can operate either in conjunction with, or as a replacement for the built in system menu clock.

screenshots.magical.1

Download

MagiCal

Mirror

MagiCal PPC MagiCal Intel

WordPress: Create Custom Post Type

Terakhir diperbaharui: Kamis, 25 Agustus 2016 pukul 15:12
Tautan: http://darto.id/2k

WordPress is capable of holding different types of content. We can create as many content types as we need depending upon the scenario in which we are working. To add more content types (generally known as “custom post types”), WordPress provides a function register_post_type() that accepts two arguments:

  1. the post type
  2. additional arguments

In the second argument, that is, the array of additional arguments, we define the labels of the post type and other specifics regarding the visibility, capability and taxonomies etc.

function uep_custom_post_type() {
    $labels = array(
        'name'                  =>   __( 'Events', 'uep' ),
        'singular_name'         =>   __( 'Event', 'uep' ),
        'add_new_item'          =>   __( 'Add New Event', 'uep' ),
        'all_items'             =>   __( 'All Events', 'uep' ),
        'edit_item'             =>   __( 'Edit Event', 'uep' ),
        'new_item'              =>   __( 'New Event', 'uep' ),
        'view_item'             =>   __( 'View Event', 'uep' ),
        'not_found'             =>   __( 'No Events Found', 'uep' ),
        'not_found_in_trash'    =>   __( 'No Events Found in Trash', 'uep' )
    );
 
    $supports = array(
        'title',
        'editor',
        'excerpt'
    );
 
    $args = array(
        'label'         =>   __( 'Events', 'uep' ),
        'labels'        =>   $labels,
        'description'   =>   __( 'A list of upcoming events', 'uep' ),
        'public'        =>   true,
        'show_in_menu'  =>   true,
        'menu_icon'     =>   IMAGES . 'event.svg',
        'has_archive'   =>   true,
        'rewrite'       =>   true,
        'supports'      =>   $supports
    );
 
    register_post_type( 'event', $args );
}
add_action( 'init', 'uep_custom_post_type' );

source: code tutplus

WordPress: Create Simple Admin Panel for Themes or Plugins

Terakhir diperbaharui: Kamis, 25 Agustus 2016 pukul 15:12
Tautan: http://darto.id/2l

When we create our themes, we also need to create our own theme options on the admin panel. By customizing the theme options, it will make it easy for us, and most importantly, for our users to control the theme. You don’t need to create hard code again to change the options. Simply select and save it. And you’ll get what you want.

You can put any kind of control options for your theme on the admin panel, such as uploading logo or choosing the headline’s category. You can use all class in WordPress to make a layout for our admin panel, and add some style to make tab or accordion effect.

Here the full code:

<?php
/* ----------------------------------------------------------
Declare vars
------------------------------------------------------------- */
$themename = "Theme Name";
$shortname = "shortname";
 
$categories = get_categories('hide_empty=0&orderby=name');
$all_cats = array();
foreach ($categories as $category_item ) {
$all_cats[$category_item->cat_ID] = $category_item->cat_name;
}
array_unshift($all_cats, "Select a category");
 
/*---------------------------------------------------
register settings
----------------------------------------------------*/
function theme_settings_init(){
register_setting( 'theme_settings', 'theme_settings' );
wp_enqueue_style("panel_style", get_template_directory_uri()."/panel.css", false, "1.0", "all");
wp_enqueue_script("panel_script", get_template_directory_uri()."/panel_script.js", false, "1.0");
}
 
/*---------------------------------------------------
add settings page to menu
----------------------------------------------------*/
function add_settings_page() {
add_menu_page( __( 'Your theme name' .' Theme Panel' ), __( 'Your theme name' .' Theme Panel' ), 'manage_options', 'settings', 'theme_settings_page');
}
 
/*---------------------------------------------------
add actions
----------------------------------------------------*/
add_action( 'admin_init', 'theme_settings_init' );
add_action( 'admin_menu', 'add_settings_page' );
 
/* ---------------------------------------------------------
Declare options
----------------------------------------------------------- */
 
$theme_options = array (
 
array( "name" => $themename." Options",
"type" => "title"),
 
/* ---------------------------------------------------------
General section
----------------------------------------------------------- */
array( "name" => "General",
"type" => "section"),
array( "type" => "open"),
 
array( "name" => "Logo URL",
"desc" => "Enter the link to your logo image",
"id" => $shortname."_logo",
"type" => "text",
"std" => ""),
 
array( "name" => "Custom Favicon",
"desc" => "A favicon is a 16x16 pixel icon that represents your site; paste the URL to a .ico image that you want to use as the image",
"id" => $shortname."_favicon",
"type" => "text",
"std" => get_bloginfo('url') ."/images/favicon.ico"),
 
array( "type" => "close"),
 
/* ---------------------------------------------------------
Home section
----------------------------------------------------------- */
array( "name" => "Homepage",
"type" => "section"),
array( "type" => "open"),
 
array( "name" => "Homepage Featured",
"desc" => "Choose a category from which featured posts are drawn",
"id" => $shortname."_feat_cat",
"type" => "select",
"options" => $all_cats,
"std" => "Select a category"),
 
array( "type" => "close"),
 
/* ---------------------------------------------------------
Footer section
----------------------------------------------------------- */
array( "name" => "Footer",
"type" => "section"),
array( "type" => "open"),
 
array( "name" => "Footer Credit",
"desc" => "You can customize footer credit on footer area her.",
"id" => $shortname."_footer_text",
"type" => "text",
"std" => ""),
 
array( "type" => "close")
 
);
 
/*---------------------------------------------------
Theme Panel Output
----------------------------------------------------*/
function theme_settings_page() {
    global $themename,$theme_options;
    $i=0;
    $message='';
    if ( 'save' == $_REQUEST['action'] ) {
      
        foreach ($theme_options as $value) {
            update_option( $value['id'], $_REQUEST[ $value['id'] ] ); }
      
        foreach ($theme_options as $value) {
            if( isset( $_REQUEST[ $value['id'] ] ) ) { update_option( $value['id'], $_REQUEST[ $value['id'] ]  ); } else { delete_option( $value['id'] ); } }
        $message='saved';
    }
    else if( 'reset' == $_REQUEST['action'] ) {
          
        foreach ($theme_options as $value) {
            delete_option( $value['id'] ); }
        $message='reset';       
    }
  
    ?>
    <div class="wrap options_wrap">
        <div id="icon-options-general"></div>
        <h2><?php _e( ' Theme Options' ) //your admin panel title ?></h2>
        <?php
        if ( $message=='saved' ) echo '<div class="updated settings-error" id="setting-error-settings_updated">
        <p>'.$themename.' settings saved.</strong></p></div>';
        if ( $message=='reset' ) echo '<div class="updated settings-error" id="setting-error-settings_updated">
        <p>'.$themename.' settings reset.</strong></p></div>';
        ?>
        <ul>
            <li>View Documentation |</li>
            <li>Visit Support |</li>
            <li>Theme version 1.0 </li>
        </ul>
        <div class="content_options">
            <form method="post">
  
            <?php foreach ($theme_options as $value) {
          
                switch ( $value['type'] ) {
              
                    case "open": ?>
                    <?php break;
                  
                    case "close": ?>
                    </div>
                    </div><br />
                    <?php break;
                  
                    case "title": ?>
                    <div class="message">
                        <p>To easily use the <?php echo $themename;?> theme options, you can use the options below.</p>
                    </div>
                    <?php break;
                  
                    case 'text': ?>
                    <div class="option_input option_text">
                    <label for="<?php echo $value['id']; ?>">
                    <?php echo $value['name']; ?></label>
                    <input id="" type="<?php echo $value['type']; ?>" name="<?php echo $value['id']; ?>" value="<?php if ( get_settings( $value['id'] ) != "") { echo stripslashes(get_settings( $value['id'])  ); } else { echo $value['std']; } ?>" />
                    <small><?php echo $value['desc']; ?></small>
                    <div class="clearfix"></div>
                    </div>
                    <?php break;
                  
                    case 'textarea': ?>
                    <div class="option_input option_textarea">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                    <textarea name="<?php echo $value['id']; ?>" rows="" cols=""><?php if ( get_settings( $value['id'] ) != "") { echo stripslashes(get_settings( $value['id']) ); } else { echo $value['std']; } ?></textarea>
                    <small><?php echo $value['desc']; ?></small>
                    <div class="clearfix"></div>
                    </div>
                    <?php break;
                  
                    case 'select': ?>
                    <div class="option_input option_select">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                    <select name="<?php echo $value['id']; ?>" id="<?php echo $value['id']; ?>">
                    <?php foreach ($value['options'] as $option) { ?>
                            <option <?php if (get_settings( $value['id'] ) == $option) { echo 'selected="selected"'; } ?>><?php echo $option; ?></option>
                    <?php } ?>
                    </select>
                    <small><?php echo $value['desc']; ?></small>
                    <div class="clearfix"></div>
                    </div>
                    <?php break;
                  
                    case "checkbox": ?>
                    <div class="option_input option_checkbox">
                    <label for="<?php echo $value['id']; ?>"><?php echo $value['name']; ?></label>
                    <?php if(get_option($value['id'])){ $checked = "checked=\"checked\""; }else{ $checked = "";} ?>
                    <input id="<?php echo $value['id']; ?>" type="checkbox" name="<?php echo $value['id']; ?>" value="true" <?php echo $checked; ?> />
                    <small><?php echo $value['desc']; ?></small>
                    <div class="clearfix"></div>
                    </div>
                    <?php break;
                  
                    case "section":
                    $i++; ?>
                    <div class="input_section">
                    <div class="input_title">
                         
                        <h3><img src="<?php echo get_template_directory_uri();?>/images/options.png" alt="">&nbsp;<?php echo $value['name']; ?></h3>
                        <span class="submit"><input name="save<?php echo $i; ?>" type="submit" class="button-primary" value="Save changes" /></span>
                        <div class="clearfix"></div>
                    </div>
                    <div class="all_options">
                    <?php break;
                     
                }
            }?>
          <input type="hidden" name="action" value="save" />
          </form>
          <form method="post">
              <p class="submit">
              <input name="reset" type="submit" value="Reset" />
              <input type="hidden" name="action" value="reset" />
              </p>
          </form>
        </div>
        <div class="footer-credit">
            <p>This theme was made by <a title="Darto KLoning" href="https://www.kloningspoon.com" target="_blank" >Darto KLoning</a>.</p>
        </div>
    </div>
    <?php
}
 
?>

We need to add some CSS styling and JavaScript effects to perfect the theme panel and make it look rather sophisticated. And we will create accordion effects onto the admin panel.

Here the full code of the CSS:

.input_section{
border:1px solid #ddd;
border-bottom:0;
background:#f9f9f9;
border-radius: 3px 3px 3px 3px;
}
.option_input label{
font-size:12px;
font-weight:700;
width:15%;
display:block;
float:left;
}
.option_input {
padding:30px 10px;
border-bottom:1px solid #ddd;
border-top:1px solid #fff;
}
.option_input small{
display:block;
float:right;
width:60%;
color:#999;
}
.option_input input[type="text"], .option_input select{
width:20%;
font-size:12px;
padding:4px;
color:#333;
line-height:1em;
background:#f3f3f3;
}
.option_input input:focus, .option_input textarea:focus{
background:#fff;
}
.option_input textarea{
width:20%;
height:175px;
font-size:12px;
padding:4px;
color:#333;
line-height:1.5em;
background:#f3f3f3;
}
.input_title h3 {
color: #464646;
cursor: pointer;
float: left;
font-size: 14px;
margin: 0;
padding: 5px 0 0;
text-shadow: 0 1px 0 #FFFFFF;
 
}
.input_title{
cursor:pointer;
border-bottom:1px solid #ddd;
margin: 0;
padding: 7px 10px;
background-color: #F1F1F1;
background-image: -moz-linear-gradient(center top , #F9F9F9, #ECECEC);
font-size: 15px;
font-weight: normal;
line-height: 1;
border-bottom-color: #DFDFDF;
box-shadow: 0 1px 0 #FFFFFF;
}
.input_title h3 img {
position: relative;
top: -2px;
vertical-align: middle;
margin-right: 5px;
}
 
.input_title span.submit{
display: block;
float: right;
margin: 0 20px;
padding: 0;
}
.clearfix{
clear:both;
}
 
form > p.submit {
float: right;
padding: 0;
margin-right: 30px;
}
.options_wrap > ul li {
display: inline;
margin-right: 5px;
}
.content_options .message {
margin-top: 30px
}
.footer-credit{
margin-top: 60px
}

 

Save the file as panel.css and put it in the same folder as function.php. The next step is to create accordion effect with jQuery and here it’s the code :

jQuery(document).ready(function(){
jQuery('.all_options').slideUp();
 
jQuery('.input_title h3').click(function(){
if(jQuery(this).parent().next('.all_options').css('display')=='none')
{    jQuery(this).removeClass('inactive');
jQuery(this).addClass('active');
jQuery(this).children('img').removeClass('inactive');
jQuery(this).children('img').addClass('active');
 
}
else
{    jQuery(this).removeClass('active');
jQuery(this).addClass('inactive');
jQuery(this).children('img').removeClass('active');
jQuery(this).children('img').addClass('inactive');
}
 
jQuery(this).parent().next('.all_options').slideToggle('slow');
});
});

Or you can add this alternative accordion effects that will open the first row.

jQuery(document).ready(function($){
  $('.all_options:not(:eq(0))').slideUp();
  $('.input_title').click(function(){
    if($(this).next('.all_options').css('display')=='none') {
      $(this)
        .removeClass('inactive').addClass('active')
        .children('img')
          .removeClass('inactive').addClass('active');
    } else {
      $(this)
        .removeClass('active').addClass('inactive')
        .children('img')
          .removeClass('active').addClass('inactive');
    }
    $(this).next('.all_options').slideToggle('slow');
  });
});

Then, save the above codes in a JavaScript file named panel_script.js. Don’t forget to put this file in the same folder as function.php.

Now that we’ve got the CSS and Javascript files created, we need to hook those files into our admin panel. Open your functions.php and find the function theme_settings_init(). You will need to modify the function and put wp_enqueue_style and wp_enqueue_script into it. The function will look like this:

function theme_settings_init(){
register_setting( 'theme_settings', 'theme_settings' );
wp_enqueue_style("panel_style", get_template_directory_uri()."/panel.css", false, "1.0", "all");
wp_enqueue_script("panel_script", get_template_directory_uri()."/panel_script.js", false, "1.0");
}

That’s it! Everything is done.

 

source: colorlabsproject

WordPress: Get Child Theme Directory Path

Terakhir diperbaharui: Kamis, 25 Agustus 2016 pukul 15:12
Tautan: http://darto.id/2m

Until now, there is no legitimate code to get WordPress child theme directory path. But, maybe this code would help you to do that.

define('child_template_directory', dirname( get_bloginfo('stylesheet_url')) );

// register the javascript
function umrah_js() {
wp_register_script( 'jquery-textualizer', child_template_directory . '/js/textualizer.min.js', array('jquery'),'', true);

wp_enqueue_script( 'jquery-textualizer' );
}
add_action( 'wp_enqueue_scripts', 'umrah_js' );

I hope this could help, since this help me too. 😀

 

source: eric p

Add Setting Page To Custom Post Type

Terakhir diperbaharui: Kamis, 25 Agustus 2016 pukul 15:12
Tautan: http://darto.id/2n

2014-09-13 07_41_27-Radio Player Streaming & Stats ‹ Radio Rodja 756 AM — WordPress

add_action('admin_menu' , 'add_settings_page');

function add_settings_page() {
add_submenu_page('edit.php?post_type=custom', 'Custom Post Type Admin', 'Custom Settings', 'edit_posts', basename(__FILE__), 'setting_page');
}

edit.php?post_type=custom

Here where you want to add custom menu to your custom post type. Change custom to your custom post type slug

Custom Post Type Admin

Change Custom Post Type Admin to what ever you want, it’s will be the page title of your settings page in the browser.

Custom Settings

Change Custom Settings for name of menu that you want to display under your custom post type. In my case, I only give Settings name, look picture above.

Setting Page

Here where you change for custom function of your setting page.