SumoMe Fixes

Update March 23, 2015: This does not work for the current version of SumoMe. But I will keep it up to help with similar situations.

The folks at Appsumo.com have released a free WordPress plugin called SumoMe that is available at http://sumome.com.

You can install SumoMe by either by adding a script to your header (if you are not using WordPress) or by installing their WordPress plugin.

Once you install it and create an account, you have the option of adding two apps:

Twilighter is a slick app that takes the text that is selected on your page and sets up a Twitter tweet using the selected text and creating a short URL back to the page from which it was selected. Your visitor can then make adjustments and click the submit button to tweet it.

The other app is List Builder which opens a modal subscription form that only asks for an email address. You can export the collected addresses as a CSV file.

List Builder caused a problem with this site where the form was showing up behind my header graphic. The problem was the z-index for that DIV element was not high enough. Adding the following code to my style.css file fixed the problem by increasing the z-index value.

.sumome-popup {
     z-index: 11111 !important;
}

Another issue I wanted to fix was the fact that the SumoMe has a control tab that appears in the upper right and visitors can see it. That control tab is of zero use to a visitor, so it is just clutter, yet I will need the tab to change settings. The best solution for now is to make it visible only if an administrator is logged into the site. Please note this code only works if your site is running on WordPress. A hat tip to koningdavid for posting the answer to a similar problem on StackOverflow.com.

Add a style sheet file called visitor.css with the following code:

#sumotest-badge {
     display:none !important;
}

In your theme’s function.php file, add the following:

function visitor_stylesheet()
{
     if (!current_user_can( 'manage_options' )) {

          wp_register_style('visitor_css', get_stylesheet_directory_uri() . '/visitor.css', array(), '1.0', 'all');
          wp_enqueue_style('visitor_css');
     }
}
add_action('wp_enqueue_scripts', 'visitor_stylesheet');

The visitor_stylesheet function checks if the current visitor to the site is an administrator (if the user can “manage_options”, then the user is an administrator). If the user is not an admin, then the visitor.css file is loaded for the user. The CSS code in visitor.css tells the browser to hide the #sumotest-badge DIV element.

Those are my fixes for SumoMe.

Happy cooking!

 

Enhanced by Zemanta

Invalid RSS Feed – ETX Character

English: This icon, known as the "feed ic...

So you are validating your WordPress blog feed and you get an invalid character error. The validator even shows you where the invalid character is located, but it looks fine in your browser!

Copy and paste the text into a text editor and you will see it. In Windows Notepad, you will see a small rectangle, and in Notepad++ you will see more – in my case, the letters “ETX” on a black background.

How did it get there? Probably because you copy and pasted your text from another source.

How do you get rid of it? There are a couple of ways:

One, find the offending post and rewrite the word before and the word the validator was pointing at and delete the original words to hopefully delete the invisible character. Then republish.

Two, create a filter  in your functions.php file to filter it out of existing posts.

function wpc_rssContent($content) {
     // Search for end-of-text character which is created by using      // chr(3) and replace with blank string.
     $content = str_replace(chr(3), '', $content);
     return $content;
}
// Filter the Excerpt RSS feed
add_filter('the_excerpt_rss', 'wpc_rssContent');
// Filter the Content RSS feed
add_filter('the_content_feed', 'wpc_rssContent');
/* Filter the Editor content to keep the character out of your 
   posts before you publish. You will need to click Save Draft at
   least once before publishing to ensure it is removed.
 */
add_filter('the_editor_content', 'wpc_rssContent');

There is probably a better solution out there, but this worked for me.

Missing Sidebar and Missed Opportunites

So I’m looking at my Google Analytics and find that my post Adobe Acrobat Pro X CS6 won’t start: how to fix has over 600 page views (539 unique) for the past month.

For a small-fry like me, that is huge!

I dug deeper and found that the most used Google search phrase for that page was “adobe acrobat x pro won’t open”. I googled it, and my article was #2 right under Adobe.com’s!

If you are reading this on my site, you can see that I run ads on the sidebar. I got excited at the thought of getting some advertising revenue and looked at my advertising stats. There were no clicks registered and the viewed ads number was a lot lower than the page views.

I looked at the page itself and realized the problem. No sidebar was showing up.

So many lost opportunities!

So where did my sidebar go? I’m not sure it was ever there to begin with.

I am using a custom child theme of the Twenty Eleven theme, but I had not done anything to change the base single post template. I downloaded index.php and single.php to look for differences and found that “get_sidebar();” was not in single.php. I copied single.php to my custom child theme folder and copy and added “get_sidebar()” function to the same place it appeared in index.php. I uploaded my new version of single.php and saw the sidebar was there, but it was shoved below the content.

Element inspection time. The CSS for the divs #primary and #content was different for the single post template. I added the following code (which is a copy of the #primary and #content from the parent theme and I added “.singular”) to my child theme’s style.css to cancel the parent theme’s CSS and get my sidebar in the right place:

.singular #primary {
float: left;
margin: 0 -26.4% 0 0;
width: 100%;
}

.singular #content {
margin: 0 34% 0 7.6%;
width: 58.4%;
}

On a side note, if you have never worked with WordPress child themes before, I highly recommend reading the WordPress Codex on Child Themes. You should never change the code of a theme someone else has made because if they update the theme you will lose your changes if you update the theme on the Update admin page.

 

Page Template Option Missing

On one of the sites I administer, we are using a premium theme that comes with custom page templates.

When setting up a new page on this site, I noticed the Page Template option was missing from the Edit Page page.

I knew older pages were using the same template, so I knew the file wasn’t missing. I checked anyway. Yep, it was there. Maybe there was something weird in the header that was keeping WordPress from registering it as a template.

I downloaded and opened the template file and this is what I found (I replaced the template name to protect the sloppy):

<?php /* Template Name: [redacted] */ ?>

I would not have thought the absence of newlines would have mattered, but I knew that was not like the example that WordPress gives here. So I added some newlines.

<?php 
/* 
Template Name: [redacted] 
*/ 
?>

(Make sure you replace [redacted] with your template name.)

Then I uploaded the change, refreshed my Edit Page and the template option was restored.

I’m off to fix the other pages.

Hopefully in the next update of this theme they fix the problem or I will need to update the page files again.

Random String Shortcode To Fix A PDF Caching Problem

On my church’s website, we post links to our missionaries’ newsletters as PDF files. We have a problem with browsers caching the older newsletters so even though a new file is on the server, the older file appears in the browsers. Not even clearing the cache seems to work. Adding to the problem is when Cloudflare.com caches the file, so I have to log in and delete the cache there.

One solution is to rename the PDF file and then change the link on the site every time. But we like to be lazy efficient around here, so I came up with a shortcode function that inserts a random string.

Adding a question mark and a random string to the end of the link so the browser would  fetch the latest version of the file rather than get the cached version in their browser’s history.

So for each newsletter link, I went into HTML mode and added

?[randomstring]

to the end of the link’s href attribute. So

<a href="http://domain.com/newsletter.pdf">Newsletter</a>

became

<a href="http://domain.com/newsletter.pdf?[randomstring]">Newsletter</a>

and when the post/page is rendered in a browser, [randomstring] would be replaced by a random string of 5 characters. 5 is the default, but the length can be changed by setting the “length” attribute in the shortcode like this:

[randomstring length=10]

Here is the code you need to add to your function.php file in your WordPress theme to make this work.

/*
 random string function
*/
if (!function_exists("random_string")) {
function random_string($atts, $content = null){
 extract(shortcode_atts(array(
 'length' => '5' 
 ),
 $atts));
 $l = $length;
 /*
 Credit: This section of code by "kriskra at gmail dot com"
 http://www.php.net/manual/en/ref.strings.php#84888
 */
 $c = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxwz0123456789";
 for(;$l > 0;$l--) $s .= $c{rand(0,strlen($c))};
 return str_shuffle($s);
}
}

add_shortcode('randomstring', 'random_string');

I decided to keep this simple by not letting the function add the question mark, because a need may arise where you need to use an ampersand instead or perhaps nothing at all.

 

Posted in PHP