www.rarescosma.com | Hardboiled Frontend & WordPress Developer https://www.rarescosma.com www.rarescosma.com | Hardboiled Frontend & WordPress Developer Sun, 26 Mar 2017 17:39:33 +0000 en-US hourly 1 https://wordpress.org/?v=4.7.3 WordPress hooks: user_register https://www.rarescosma.com/2011/04/wordpress-hooks-user_register/ https://www.rarescosma.com/2011/04/wordpress-hooks-user_register/#comments Thu, 21 Apr 2011 20:38:49 +0000 http://www.rarescosma.com/?p=334 I’m gonna keep things short in this article and show you how you can automatically alter WordPress user data after registration.

Use Case: Changing the user’s Display Name

One of WordPress’ present shortcomings is the lack of a configuration option to specify a default display name format for your users. The last sentence was long, so let me give you an example.

Let’s say you’ve allowed user registration on your WordPress website (Settings – General) but instead of the plain username, you want to display their full name on the articles they submit.

You have two options. Either you independently edit each user and change the ‘Display Name’ option or…

Enter the ‘user_register’ hook

This action hook runs immediately after the successful registration of a new user on your website. It passes on the user ID to the callback function. For our purpose, the code is very simple:

class myUsers {
	static function init() {
		// Change the user's display name after insertion
		add_action( 'user_register', array( __CLASS__, 'change_display_name' ) );
	}

	static function change_display_name( $user_id ) {
		$info = get_userdata( $user_id );

		$args = array(
			'ID' => $user_id,
			'display_name' => $info->first_name . ' ' . $info->last_name
		);

		wp_update_user( $args );
	}
}

myUsers::init();

First, we grab the newly created user information with the get_userdata() function. Then, we concatenate the first name and the last name and feed it as an argument to wp_update_user().

Just paste this into your functions.php file and you’re all set.

References

Thank you for [retweet-anywhere].

]]>
https://www.rarescosma.com/2011/04/wordpress-hooks-user_register/feed/ 9
Send out custom Tweets from WordPress using Twitter Tools https://www.rarescosma.com/2011/04/send-out-custom-tweets-from-wordpress-using-twitter-tools/ https://www.rarescosma.com/2011/04/send-out-custom-tweets-from-wordpress-using-twitter-tools/#comments Wed, 13 Apr 2011 17:17:01 +0000 http://www.rarescosma.com/?p=329 In this post I will explain how you can send out custom tweets from WordPress. For this purpose, we will configure and use the functionality present in the WordPress Twitter Tools plug-in.

Get Twitter Tools

Head over to the WordPress plugin repository and grab the Twitter Tools zip file. Upload it to your /wp-content/plugins directory and unzip. Next, go to the Plugins section of your WP admin and activate the plugin.

Twitter Tools bundles a set of complementary plugins. Make sure you activate Twitter Tools – Bit.ly URLs for the URL shortening ability. We’ll be using this plugin to send out custom tweets (triggered by any type of action), so we don’t need the other components (Exclude Category and Hashtags).

Connect to Twitter

Follow the instructions on the Twitter Tools settings page to connect your website to Twitter. First, you need to register your site as a Twitter application. A couple of things to keep in mind:

  • Your Application’s Name will be what shows up after “via” in your twitter stream
  • Application Type should be set on Browser
  • The Callback URL should be your website URL
  • Default Access type should be set to Read & Write

A screenshot is worth more than 1000 words, so here’s an example:

A couple of special strings used for authentication and API access need to be copied over to Twitter Tools:

  • The Twitter Consumer Key and Consumer Secret
  • The application Access Token and Access Token Secret

The latter can be found by going to ‘My Access Token’ in the right menu:

Configure Twitter Tools

Remember that we only need this plugin as a support to send out our custom Tweets, so we’re gonna disable all the auto-tweeting functionality. Set the following options to ‘No’:

  • Enable option to create a tweet when you post in your blog?
  • Create tweets from your sidebar?
  • Create a daily digest blog post from your tweets?

That’s it! Now let’s get down to some coding.

Example code for a custom tweet

Suppose your website uses a Custom Post Type called ‘product’ and you want to send out a custom notification on Twitter each time a new ‘product’ is added.

First let’s create a custom function that uses (or hijacks) the Twitter Tools objects to tweet out a text portion, a link and some hashtags:

function my_tweet( $args = array() ) {
  // Check reqs 
  if( ! class_exists( 'aktt_tweet' ) )
    return;

  global $aktt;

  // Set up defaults
  $defaults = array(
    'text' => '',
    'url' => '',
    'tags' => array()
  );

  // Extract the arguments
  extract( wp_parse_args( $args, $defaults ) );

  // Sanity check
  if( empty( $text ) )
    return;
  
  // Add the URL, after shortening
  if( ! empty( $url ) )
    $text .= ' ' . aktt_bitly_shorten_url( $url );

  // Add the hashtags
  if( count( $tags ) )
    $separator = ' #';
    $text .= $separator . implode( $separator, $tags );

  // Initialize the aktt_tweet object
  $tweet = new aktt_tweet;
  $tweet->tw_text = @html_entity_decode( $text , ENT_COMPAT, 'UTF-8' );

  // And Tweet!
  return $aktt->do_tweet( $tweet ); 
}

Armed with this awesome function, we’ll use the wp_insert_post action hook to check when a new ‘product’ is added:

add_action( 'wp_insert_post' , 'my_twitter_notifications' , 99 );
function my_twitter_notifications( $post_id ) {
  $post = get_post( $post_id );
  if( $post->post_status != 'publish' ) return;
  
  switch ( $post->post_type ) {
    case 'product':
      // Tweet it
      $args = array(
        'text' => 'New Product: ' . $post->post_title,
        'url' => get_permalink( $post_id ),
        'tags' => array( '#awesome', '#merchandise', '#fb' )
      );
      
      my_tweet( $args );
    break;
  }
}

This function checks the post type and calls the my_tweet function with the appropriate arguments.

That’s all folks. See you for my next WordPress tutorial (which will hopefully come sooner).

As always, thank you for [retweet-anywhere].

]]>
https://www.rarescosma.com/2011/04/send-out-custom-tweets-from-wordpress-using-twitter-tools/feed/ 6
Add a class to wp_nav_menu() items with URLs included in the current URL https://www.rarescosma.com/2010/11/add-a-class-to-wp_nav_menu-items-with-urls-included-in-the-current-url/ https://www.rarescosma.com/2010/11/add-a-class-to-wp_nav_menu-items-with-urls-included-in-the-current-url/#comments Tue, 23 Nov 2010 14:16:38 +0000 http://www.rarescosma.com/?p=326 The Problem

We’re all enjoying the benefits and features of WordPress 3.0. Custom menus are awesome and custom post types shatter all capability and imagination limits. A small problem arises when these two features are used in conjunction: the classes applied to navigation menu items only reflect direct inheritance, and entities that have their URLs included in the current URL can’t get highlighted.

Let me illustrate through a simple example:

Suppose you defined a ‘Services’ page that lives at this URL: http://example.com/services/.
This page has an entry in the main menu of your website. To further emphasize your services, you also defined a ‘services’ custom post type with the slug services. The URL of a ‘service’ post can be http://example.com/services/branding/.

When you browse the ‘Branding’ post, however, no special class is applied to the menu entry of your ‘Services’ page, and it’s impossible to style it as the current section of your website, even though the proposed URL structure is semantic.

The Solution

The solution is based on the nav_menu_css_class WordPress hook. This is a filter hook that allows us to alter an array containing CSS classes that will be applied to a menu item.

We also need a way to find the current URL, or the URL being browsed.

The Code

add_filter( 'nav_menu_css_class', 'add_parent_url_menu_class', 10, 2 );

function add_parent_url_menu_class( $classes = array(), $item = false ) {
	// Get current URL
	$current_url = current_url();
	
	// Get homepage URL
	$homepage_url = trailingslashit( get_bloginfo( 'url' ) );
		
	// Exclude 404 and homepage
	if( is_404() or $item->url == $homepage_url ) return $classes;
	
	if ( strstr( $current_url, $item->url) ) {
		// Add the 'parent_url' class
		$classes[] = 'parent_url';
	}
	
	return $classes;
}

function current_url() {
	// Protocol
	$url = ( 'on' == $_SERVER['HTTPS'] ) ? 'https://' : 'http://';
	
	$url .= $_SERVER['SERVER_NAME'];
	
	// Port
	$url .= ( '80' == $_SERVER['SERVER_PORT'] ) ? '' : ':' . $_SERVER['SERVER_PORT'];
	
	$url .= $_SERVER['REQUEST_URI'];
	
	return trailingslashit( $url );
}

In the hooked function, a check is first made to see if we’re on a 404 page. When an invalid URL is accessed, we don’t want to highlight anything.

The same holds if the menu item points to the domain root URL: all other URLs on the website include it.

The rest is pretty straightforward: add the class if the menu item URL is included in the current URL and return the $classes array.

Thank you for [retweet-anywhere].

]]>
https://www.rarescosma.com/2010/11/add-a-class-to-wp_nav_menu-items-with-urls-included-in-the-current-url/feed/ 24
Very Sirius Productions https://www.rarescosma.com/2010/05/very-sirius-productions/ Tue, 11 May 2010 14:39:13 +0000 http://www.rarescosma.com/?p=94

Description

Very Sirius Productions is the online identity of creative director David Mayne. The site features a heavily modified version of the Modularity WordPress theme.

The main highlight is the HD Media Player used to present his extensive video portfolio. As a side-project, I also developed the “Creative Impulses” playground blog.

Both websites are powered by WordPress

Features

  • Custom theme built on top of the Modularity Framework
  • Full screen High Definition Media player
  • Custom, media-rich Categories and Posts templates
  • Non-standard web fonts embedding (Cufón)
  • Back-end programming to accommodate all the new needed options
 
]]>
IE6 Memorabilia https://www.rarescosma.com/2010/04/ie6-memorabilia/ https://www.rarescosma.com/2010/04/ie6-memorabilia/#comments Wed, 14 Apr 2010 14:27:56 +0000 http://www.rarescosma.com/?p=223 In terms of standards-compliance and feature support, nothing causes more pain to a developer than Internet Explorer 6.

It caused hours of painful debugging to get the same look and feel for a website. It put brilliant minds at work to devise hacks and workarounds to make it more standards-compliant. It killed millions of web developer neurons just because a small percentage of people (including, maybe, your client’s peers) have refused to upgrade.

There used to be a time when on any given day you’d hear someone in the office say: “Oh man, I wish IE6 was dead already!” But after the outrage settled, the person responsible would sit down and respect the accessibility code by continuing the mind-numbing debugging process. The day IE6 died was a concept similar to the “light at the end of the tunnel” – a recognized reality situated somewhere in the future at a psychologically infinite distance.

But the future is promising. Things are definitely steering in the right direction with Google and Amazon joining the ‘kill-IE6’ army last month. Some have even gone so far as proclaiming the browser dead and organized an obituary and wake in its painful memory. I must say I sympathize with these people from all my heart as I proudly join them and refuse the total waste of resources called ‘developing for IE6’.

As far as I’m concerned IE6 is dead.

That’s why I’ll finally get to the point of this post: a small compilation of IE6-related memorabilia.

1. What God does to kitten when you use IE6

IE6, God and kittens

Original source: António Farinha

2. What retarded PNG support and CSS compliance does to fragile developers

Hugs for Monsters 1

Hugs for Monsters 2

Original source: Laughing Squid

3. A friendlier way of disposing IE6 users

Browser Playground

Original source: John Martz

4. IE6 Standards compliance demonstrated on a human model

IE6 Standards compliance

Original source: Atzu

5. The life, times and death of IE6

IE6 Comic StripIE6 Comic Strip 2IE6 Comic Strip 3IE6 Comic Strip 4

Original source: Smashing Magazine

Related Articles and resources:

Edit: @markkolich suggested adding a link to the crash IE6 jQuery plugin.

]]>
https://www.rarescosma.com/2010/04/ie6-memorabilia/feed/ 1
WordPress Default Settings https://www.rarescosma.com/2010/02/wordpress-default-settings/ Thu, 04 Feb 2010 12:17:16 +0000 http://www.rarescosma.com/?p=163 Default WordPress Configuration Settings

Do you often find yourself changing the default WordPress settings after a fresh install? Not anymore.

WPEngineer has a great article promoting a very simple but ultra-effective plugin.

The plugin was written by Thomas Scholz and addresses the problem of always having to do the same adjustments after a clean WordPress install.

Examples include setting the Permalink structure, deleting the default post, and basically altering any other default setting from the wp_options table. If you don’t have database access you can access an automatically generated overview of available options at [your_base_URL]/wp-admin/options.php

Instructions

  1. Download the plugin by toscho
  2. Upload the plugin into your /wp-content/plugins/ directory
  3. Activate the plugin
  4. Deactivate the plugin
  5. Delete the plugin

The Code

 
<?php
/*
Plugin Name: Toscho's basic settings
Plugin URI: http://toscho.de/2010/wordpress-grundeinstellungen-per-plugin-setzen/
Description: Some useful default configuration settings. See 'wp-admin/options.php' for more options.
Version: 0.2
Author: Thomas Scholz
Author URI: http://toscho.de
*/
function set_toscho_defaults()
{
    $o = array(
        'avatar_default'            => ''blank',
        'avatar_rating'             => 'G',
        'category_base'             => '/thema',
        'comment_max_links'         => 0,
        'comments_per_page'         => 0,
        'date_format'               => 'd.m.Y',
        'default_ping_status'       => 'closed',
        'default_post_edit_rows'    => 30,
        'links_updated_date_format' => 'j. F Y, H:i',
        'permalink_structure'       => '/%year%/%postname%/',
        'rss_language'              => 'de',
        'timezone_string'           => 'Etc/GMT-1',
        'use_smilies'               => 0,
    );
    foreach ( $o as $k => $v )
    {
        update_option($k, $v);
    }
    // Delete dummy post and comment.
    wp_delete_post(1, TRUE);
    wp_delete_comment(1);
    return;
}
register_activation_hook(__FILE__, 'set_toscho_defaults');
?>

Update: Thomas has provided me with a link to a public repository on GitHub. Feel free to contribute.
http://github.com/toscho/WordPress-Basic-Settings

]]>
Link separator for wp_list_pages() https://www.rarescosma.com/2010/02/link-separator-for-wp_list_pages/ https://www.rarescosma.com/2010/02/link-separator-for-wp_list_pages/#comments Wed, 03 Feb 2010 16:44:07 +0000 http://www.rarescosma.com/?p=143 The Problem

A common problem with the WordPress built-in function for page navigation is the lack of anchor text separator support.

In version 2.7 two more arguments for wp_list_pages() were added to mitigate this inconvenience: link_before and link_after. When using these, the function prepends or appends the specified strings to the generated anchor text. This works well for styling vertical menus.

However, for horizontal menus like the one below, you want the separator to appear between consecutive links and both options become unsuitable:

  • link_before would produce extra markup before the first link
  • link_after would produce extra markup after the last link

Horizontal Menu Example

The solution

The solution I came up with for a recent project involves using regular expressions to inject the page separator. Basically, you want to alter the structure of all links except the last one. This can be accomplished by searching for all list elements that are followed by an extra list element.

The code

$args = array(
  'sort_column' => 'menu_order',
  'title_li' => '',
  'depth' => '1',
  'echo' => 0
);
$separator = ' | ';
$pattern = '/(<\\/a>).*?(<\\/li>).*?(<li)/is';
$replace = '</a>' . $separator . '</li><li';
$subnav = preg_replace($pattern,$replace,wp_list_pages($args));
echo $subnav;

You can specify the separator string in the $separator variable and alter its appearance position by changing the $replace variable.

Resources

]]>
https://www.rarescosma.com/2010/02/link-separator-for-wp_list_pages/feed/ 16
Arthur Green https://www.rarescosma.com/2010/01/arthur-green/ Thu, 21 Jan 2010 15:45:47 +0000 http://www.rarescosma.com/?p=41

Description

This website constitutes the online identity of public accountant and business adviser Arthur Green. The site content is easily manageable thanks to the WordPress CMS Integration services I provided.

Other notable features include the integration of 3rd party log-in forms to simplify client access to valuable online accounting tools.

Features

  • True WordPress powered Content Management System
  • Non-standard web fonts embedding (Cufón)
  • 3rd party forms integration: Quickbooks & Sharefile
  • reCAPTCHA contact form
]]>
Downtown Wine & Spirits https://www.rarescosma.com/2009/12/downtown-wine-and-spirits/ Tue, 15 Dec 2009 13:41:07 +0000 http://rarescosma.com/?p=3

Description

The main highlight of this project was the seamless integration of four separate blogs into a unified environment provided by WordPress MU.

This solution allowed the authors to continue publishing on the same platform they were familiar with while also providing consistency to their web presence through the unified user interface.

Features

  • Five distinct blogs integrated with WordPress MU
  • Custom content for the homepage Polaroids
  • Accessible typography through the use of sIFR
  • Integration of an awesome Flash tag cloud
  • Custom form development for E-mail sign-ups
]]>
30 Delivery https://www.rarescosma.com/2009/12/30-delivery/ Mon, 07 Dec 2009 15:40:28 +0000 http://www.rarescosma.com/?p=36

Description

Can a business be based entirely online? 30 Delivery successfully answered this question when they choose to base their web store on Magento – a revolutionary eCommerce platform.

All content (products & pages) is manageable through a comprehensive CMS, and, with the innovative one-page checkout process the client can have his order on the way within seconds.

A custom module was developed as a way to alert customers that they could only deliver products during certain times. Also, a Firstdata Payment Gateway module was crafted specifically for this project.

Features

  • Fully functional Magento powered web store
  • Products, categories and pages manageable via the CMS
  • One-page checkout process
  • Customers can choose to register for even faster future order processing
  • Custom delivery intervals module
  • Custom payment gateway development (Firstdata)
]]>
Boston Unique Properties https://www.rarescosma.com/2009/11/boston-unique-properties/ Sat, 14 Nov 2009 15:41:23 +0000 http://www.rarescosma.com/?p=38

Description

Boston Unique Properties is a real estate listing website run by Lawrence Shevick, one of Boston’s top sales agent. The unique design was carefully coded and integrated into a WordPress powered Content Management System.

On the back-end, custom field templates were developed for easier property data entry. On the front-end, the jQuery and Fancybox powered image galleries provide an immersive user experience.

Features

  • Clean, semantic XHTML coding
  • WordPress powered real estate listings CMS
  • Custom field template for property data entry
  • Fancybox image gallery
]]>
Sean Marshall Galleries https://www.rarescosma.com/2009/11/sean-marshall-galleries/ Tue, 03 Nov 2009 15:39:07 +0000 http://www.rarescosma.com/?p=34

Description

Sean Marshall’s passion for photography makes him a perfectionist. Extreme care was needed during the development of his virtual gallery and print shop.

The site matches the design to pixel precision and allows lovers of fine art to browse Sean’s galleries in a unique fashion and buy his prints in various sizes.

Features

  • Pixel precision hand-coded design
  • Filmstrip and Grid based view of photo galleries
  • WordPress eCommerce integration
  • Product details pop-up with AJAX shopping cart
  • Authorize.net payment gateway integration
]]>
Foods of Quebec https://www.rarescosma.com/2009/10/foods-of-quebec/ Wed, 21 Oct 2009 16:14:44 +0000 http://www.rarescosma.com/?p=47

Description

The Government of Quebec established this online identity site to support the sustainable development of the Québec food industry.

I provided my PSD to HTML coding services to produce clean, semantic and speed-optimized base code for their efforts.

Features

  • Highly semantic and clean HTML & CSS code
  • Speed optimized site structure composed entirely of static HTML files
  • A Flash placeholder for the homepage
]]>
NCA Architects https://www.rarescosma.com/2009/10/nca-architects/ Sat, 17 Oct 2009 16:16:56 +0000 http://www.rarescosma.com/?p=50

Description

The New England based architecture firm refreshed its online identity in 2008.

I provided design conversion services and delivered clean, semantic and speed-optimized HTML code.

Features

  • Highly semantic and clean HTML & CSS code
  • Flash placeholders for the homepage and several inner pages
]]>
Terra Mamaliga https://www.rarescosma.com/2009/10/terra-mamaliga/ Mon, 05 Oct 2009 16:24:49 +0000 http://www.rarescosma.com/?p=62

Description

Terra Mamaliga is an event blog commissioned by the French Cultural Center in my hometown. It advertises a traditional food fair.

For this project I customized an existing WordPress theme and added some neat User Interface effects to the producers list.

Features

  • WordPress powered CMS
  • Theme customization: integration of client’s graphic elements and color theme
  • User Interface enhancements and effects
]]>
Shalrie Joseph Academy https://www.rarescosma.com/2009/09/shalrie-joseph-academy/ Thu, 24 Sep 2009 16:19:04 +0000 http://www.rarescosma.com/?p=53

Description

Shalrie Joseph is a fun player running soccer training programs for kids throughout Massachusetts.

I helped bring his website to life offering my best PSD to HTML / CSS coding skills.

Features

  • Clean and highly semantic HTML code
  • Speed optimized site structure composed entirely of static HTML files
  • CSS-styled tables
]]>
Casasolara.com https://www.rarescosma.com/2009/09/casasolara-com/ Mon, 21 Sep 2009 16:26:11 +0000 http://www.rarescosma.com/?p=64

Description

Casasolara.com is a local business specializing in eco-friendly solar panel technology. The front-end features a slight variation of the WordPress default theme.

The over-simplified design is balanced out by the website functionality: a fully operational eCommerce solution based on the WordPress Shopp plug-in.

The checkout process was customized to allow the entering of business credentials specific to Romanian commerce practices.

Features

  • WordPress powered CMS
  • WordPress & Shopp based eCommerce solution
  • Custom checkout fields and process
  • Intelligent category side menu
]]>
Burton’s Grill https://www.rarescosma.com/2009/09/burtons-grill/ Mon, 14 Sep 2009 16:20:58 +0000 http://www.rarescosma.com/?p=55

Description

This New England based restaurant chain prides itself with its commitment to quality. It is the very same principle that governed my work when I coded their new design into clean, semantic and valid HTML / CSS.

Features

  • Semantic, clean and valid HTML & CSS code
  • Various Flash placeholders throughout the site
  • Multipage forms programming
]]>
Green Beacon Solutions https://www.rarescosma.com/2009/09/green-beacon-solutions/ Tue, 08 Sep 2009 16:13:47 +0000 http://www.rarescosma.com/?p=45

Description

Green Beacon Solutions is a firm specializing in Business Management software. Their new website design was coded by me into skeleton HTML / CSS files they could later use to implement a CMS

For the homepage user experience I programmed an animated banner that very much resembles Flash technology. It’s done entirely in Javascript to allow for easy content management.

Features

  • Clean and semantic PSD to HTML / CSS coding
  • Animated homepage banner developed with Mootools
  • Inner page transition effects
]]>
Box-o-box https://www.rarescosma.com/2009/09/box-o-box/ Thu, 03 Sep 2009 16:24:01 +0000 http://www.rarescosma.com/?p=60

Description

Box-o-Box helps parents throughout the US support their student kids. The site went through a major face-lift in 2008.

The main requirement was to keep their custom built eCommerce system. I coded their new design, integrated it into their old system and programmed additional features.

Features

  • PSD to HTML conversion of a difficult design
  • Custom built eCommerce system
  • Integrated Authorize.net Payment Gateway
  • AJAXed Zip code verification
]]>