Categories: MiscellaneousUncategorizedWeb DesignWordpress

How to Edit Cherry Options’ Social Icons

In order to change the icon images, you need to replace the default .png files with new .png files having the same names under the wp-contentthemestheme####imagesicons folder on your FTP.

In order to make the links open in a new window,

Go to the wp-contentthemesCherryFrameworkincludeswidgets directory via FTP. Download my-social-widget.php file.
Copy/move the copied file to the wp-contentthemestheme####includeswidgets folder (where theme#### is the unique name of your theme).
The file is now located in the wp-contentthemestheme####includeswidgets directory.
Open the my-social-widget.php file to edit.
Hit Ctrl + F on your keyboard and look for this line

1	`<a` `class="social_link social_link__<?php echo strtolower($network); ?>"` `rel="tooltip"` `data-original-title="<?php echo strtolower($network); ?>"` `href="<?php echo $networks[$network]['link']; ?>">`

Add target=”_blank” after the href=”” attribute so it looks

1	`<a` `class="social_link social_link__<?php echo strtolower($network); ?>"` `rel="tooltip"` `data-original-title="<?php echo strtolower($network); ?>"` `href="<?php echo $networks[$network]['link'] ; ?>"` `target="_blank">`

Save the changes to the file and try clicking the icons on your site.

In order to add a new social media icon, for instance one for Picasa (you will just need to change “Picasa” and “picasa” in the lines of this tutorial if you are going to add a different button, like “Lastfm”/”lastfm”, “Tumblr”/”tumblr” etc):

Navigate to the wp-contentthemestheme####includeswidgets folder (where theme#### is the unique name of your theme) via FTP.
Open the my-social-widget.php file to edit.
Under (any line can be found using Ctrl + F)

$networks['Twitter']['link'] = $instance['twitter'];

$networks['Facebook']['link'] = $instance['facebook'];

$networks['Flickr']['link'] = $instance['flickr'];

$networks['Feed']['link'] = $instance['feed'];

$networks['Linkedin']['link'] = $instance['linkedin'];

$networks['Delicious']['link'] = $instance['delicious'];

$networks['Youtube']['link'] = $instance['youtube'];

add

1	`$networks['Picasa']['link'] =` `$instance['picasa'];`

Under

$networks['Twitter']['label'] = $instance['twitter_label'];

$networks['Facebook']['label'] = $instance['facebook_label'];

$networks['Flickr']['label'] = $instance['flickr_label'];

$networks['Feed']['label'] = $instance['feed_label'];

$networks['Linkedin']['label'] = $instance['linkedin_label'];

$networks['Delicious']['label'] = $instance['delicious_label'];

$networks['Youtube']['label'] = $instance['youtube_label'];

add

1	`$networks['Picasa']['label'] =` `$instance['picasa_label'];`

Change

1	`<?php` `foreach(array("Facebook",` `"Twitter",` `"Flickr",` `"Feed",` `"Linkedin",` `"Delicious",` `"Youtube")` `as` `$network) : ?>`

1	`<?php` `foreach(array("Facebook",` `"Twitter",` `"Flickr",` `"Feed",` `"Linkedin",` `"Delicious",` `"Youtube",` `"Picasa")` `as` `$network) : ?>`

Under

$instance['twitter'] = $new_instance['twitter'];

$instance['facebook'] = $new_instance['facebook'];

$instance['flickr'] = $new_instance['flickr'];

$instance['feed'] = $new_instance['feed'];

$instance['linkedin'] = $new_instance['linkedin'];

$instance['delicious'] = $new_instance['delicious'];

$instance['youtube'] = $new_instance['youtube'];

add

1	`$instance['picasa'] =` `$new_instance['picasa'];`

Under

$instance['twitter_label'] = $new_instance['twitter_label'];

$instance['facebook_label'] = $new_instance['facebook_label'];

$instance['flickr_label'] = $new_instance['flickr_label'];

$instance['feed_label'] = $new_instance['feed_label'];

$instance['linkedin_label'] = $new_instance['linkedin_label'];

$instance['delicious_label'] = $new_instance['delicious_label'];

$instance['youtube_label'] = $new_instance['youtube_label'];

add

1	`$instance['picasa_label'] =` `$new_instance['picasa_label'];`

Change

$defaults = array( 'title' => '', 'twitter' => '', 'twitter_label' => '', 'facebook' => '', 'facebook_label' => '', 'flickr' => '', 'flickr_label' => '', 'feed' => '', 'feed_label' => '', 'linkedin' => '', 'linkedin_label' => '', 'delicious' => '', 'delicious_label' => '', 'youtube' => '', 'youtube_label' => '', 'display' => 'icons', 'text' => '');

Under

$twitter = $instance['twitter'];

$facebook = $instance['facebook'];

$flickr = $instance['flickr'];

$feed = $instance['feed'];

$linkedin = $instance['linkedin'];

$delicious = $instance['delicious'];

$youtube = $instance['youtube'];

add

1	`$picasa` `=` `$instance['picasa'];`

Under

$twitter_label = $instance['twitter_label'];

$facebook_label = $instance['facebook_label'];

$flickr_label = $instance['flickr_label'];

$feed_label = $instance['feed_label'];

$linkedin_label = $instance['linkedin_label'];

$delicious_label = $instance['delicious_label'];

$youtube_label = $instance['youtube_label'];

add

1	`$picasa_label` `=` `$instance['picasa_label'];`

Under

<fieldset style="border:1px solid #dfdfdf; padding:10px 10px 0; margin-bottom:1em;"><br>

<legend style="padding:0 5px;"><?php _e('Youtube', CURRENT_THEME); ?>:</legend><br>

<label for="<?php echo $this->get_field_id('youtube'); ?>"><?php _e('Youtube URL:', CURRENT_THEME); ?></label><br>

<input class="widefat" id="<?php echo $this->get_field_id('youtube'); ?>" name="<?php echo $this->get_field_name('youtube'); ?>" type="text" value="<?php echo esc_attr($youtube); ?>" /><br>

<label for="<?php echo $this->get_field_id('youtube_label'); ?>"><?php _e('Youtube label:', CURRENT_THEME); ?></label><br>

<input class="widefat" id="<?php echo $this->get_field_id('youtube_label'); ?>" name="<?php echo $this->get_field_name('youtube_label'); ?>" type="text" value="<?php echo esc_attr($youtube_label); ?>" /><br>

</fieldset>

Add

<fieldset style="border:1px solid #dfdfdf; padding:10px 10px 0; margin-bottom:1em;"><br>

<legend style="padding:0 5px;"><?php _e('Picasa', CURRENT_THEME); ?>:</legend><br>

<label for="<?php echo $this->get_field_id('picasa'); ?>"><?php _e('Picasa URL:', CURRENT_THEME); ?></label><br>

<input class="widefat" id="<?php echo $this->get_field_id('picasa'); ?>" name="<?php echo $this->get_field_name('picasa'); ?>" type="text" value="<?php echo esc_attr($picasa); ?>" /><br>

<label for="<?php echo $this->get_field_id('picasa_label'); ?>"><?php _e('Picasa label:', CURRENT_THEME); ?></label><br>

<input class="widefat" id="<?php echo $this->get_field_id('picasa_label'); ?>" name="<?php echo $this->get_field_name('picasa_label'); ?>" type="text" value="<?php echo esc_attr($picasa_label); ?>" /><br>

</fieldset>

And save your changes
Upload a picasa.png to the /wp-content/themes/theme_###/images/icons/ folder via FTP. The new image should have the same dimensions as the original social icon images you can find this folder. Sometimes in the /wp-content/themes/theme_###/images/icons/ folder there are ready-made icons already included.
In your WordPress admin, go to Appearance -> Widgets -> Cherry – Social Networks. There should be a new option for Picasa at the bottom with the two fields to fill in.

Fill in the fields, click “Save” and open the page where your social media icons widget are displayed and check if the new icon is there.

In order to change the tooltips, for example of facebook to myfacebook

Rename facebook.png in the wp-contentthemestheme####imagesicons folder to myfacebook.png
Open my-social-widget.phop file located in the wp-contentthemestheme####includeswidgets folder.
Change the name in line 15