Ask your WordPress questions! Pay money and get answers fast! Comodo Trusted Site Seal
Official PayPal Seal

Make my plugin compatible with all Header tags instead of just h3 WordPress

  • SOLVED

Hi all,

I recently released a plugin named Hide Widget Title into the plugin repository [[LINK href="http://wordpress.org/extend/plugins/hide-widget-title/"]]here[[/LINK]].

This plugin allows you to selectively hide the titles of any widget on the frontend while still showing the title to the admin in the backend.

There is a shortcoming to this plugin in that it only hides widget titles that are in the h3 header tag, if a theme uses h1, h2, h4, h5, or h6, the plugin fails and the widget title is not hidden.

I know enough to ask this question but not enough to code it (I paid to have this plugin created). What I need is for the hardcoded h3 to be turned into an array of all possible header tags. This will ensure that it will work with all theme css.

I was alerted to this by @courtneyengle on Twitter and her colleague posted a quick fix by editing the plugin file directly. You can see a screencast of this [[LINK href="http://www.screencast.com/users/internetgenius/folders/Jing/media/bfaaa43b-638e-494d-b163-bdc534afc9f2"]]here[[/LINK]].

Editing a plugin file is not ideal of course, so below is the full content of the file where this is defined:
$title = $_GET['id'];
$description = "#".$title." h3 { display:none; }";


Is there a way to turn that into an array that can include all header tags?

Full file here:
<?php
$blogheader = explode("wp-content",$_SERVER["SCRIPT_FILENAME"]);
include $blogheader[0]."wp-blog-header.php";
global $wpdb;
$site_uri = get_settings('siteurl');
$table_name = $wpdb->prefix . "displaywidget";
$action = $_GET['action'];

$title = $_GET['id'];
$description = "#".$title." h3 { display:none; }";

if($action=='addwidgetoption') {
/* code to insert title need to hide from backend */
$sql_insert = "INSERT INTO ".$table_name." SET
title = '".$title."',
description = '".$description."'";
$results = $wpdb->query($sql_insert);



/* code to select css values from database and write all css to style.css file */
$sql_DWidget = "Select * from ".$table_name;
$CssResponse = $wpdb->get_results($sql_DWidget);
foreach($CssResponse as $CssClass) {
$descCss .= $CssClass->description.' ';
}

$blog_title = get_bloginfo('name'); // To display blog title
$template_path = get_option('template');

/* code to write style.css according to checkbox selection*/
$myFile = ABSPATH."/wp-content/plugins/hide-widget-title/style.css";
$fh = fopen($myFile, 'w') or die("can't open file");
fwrite($fh,$descCss);
fclose($fh);


echo 'Hide title from public users.';
}

?>

Answers (4)

2011-01-20

Peter Michael answers:

Untested, but should do the trick:

$header_tags = array('h1','h2','h3','h4','h5');
$description = '';
foreach($header_tags as $header_tag)
{
$description .= "#".$title." ".$header_tag." { display:none; }\n";
}


Adam W. Warner comments:

I have tried this and it's not yet working but it seems like the array I'm after.

In that screencast I linked to the author edited the header tag from:
h3

to

h2.widgettitle

Notice the added ".widgettitle".

After I tried your code above, I tried adding that .widgettitle to your code, but admittedly don't know what the correct syntax would be. I tried about three different ways and none worked, but I don't know if it should have or not;)

Here is the full code again with your added code. Does this look like it should be working?

<?php
$blogheader = explode("wp-content",$_SERVER["SCRIPT_FILENAME"]);
include $blogheader[0]."wp-blog-header.php";
global $wpdb;
$site_uri = get_settings('siteurl');
$table_name = $wpdb->prefix . "displaywidget";
$action = $_GET['action'];

//$title = $_GET['id'];
//$description = "#".$title." h3 { display:none; }";

//Added this to make header tags array
$header_tags = array('h1','h2','h3','h4','h5');

$description = '';

foreach($header_tags as $header_tag)

{

$description .= "#".$title." ".$header_tag." { display:none; }\n";

}
//end of header tag array code

if($action=='addwidgetoption') {
/* code to insert title need to hide from backend */
$sql_insert = "INSERT INTO ".$table_name." SET
title = '".$title."',
description = '".$description."'";
$results = $wpdb->query($sql_insert);



/* code to select css values from database and write all css to style.css file */
$sql_DWidget = "Select * from ".$table_name;
$CssResponse = $wpdb->get_results($sql_DWidget);
foreach($CssResponse as $CssClass) {
$descCss .= $CssClass->description.' ';
}

$blog_title = get_bloginfo('name'); // To display blog title
$template_path = get_option('template');

/* code to write style.css according to checkbox selection*/
$myFile = ABSPATH."/wp-content/plugins/hide-widget-title/style.css";
$fh = fopen($myFile, 'w') or die("can't open file");
fwrite($fh,$descCss);
fclose($fh);


echo 'Hide title from public users.';
}

?>


Peter Michael comments:

Hello Adam, here's the complete code with my changes. Let me know.


<?php
$blogheader = explode("wp-content",$_SERVER["SCRIPT_FILENAME"]);
include $blogheader[0]."wp-blog-header.php";

global $wpdb;

$site_uri = get_settings('siteurl');
$table_name = $wpdb->prefix . "displaywidget";
$action = $_GET['action'];
$title = $_GET['id'];

# $description = "#".$title." h3 { display:none; }";

$header_tags = array('h1','h2','h3','h4','h5');
$description = '';
# Loop trough all header tags and generate a CSS style line for each tag
# i.e. '#title h1.widgettitle {display:none!important;}'
foreach($header_tags as $header_tag) {
$description .= "#".$title." ".$header_tag.".widgettitle {display:none!important;}\n";
}

if($action=='addwidgetoption') {
/* code to insert title need to hide from backend */
$sql_insert = "INSERT INTO ".$table_name." SET title = '".$title."', description = '".$description."'";
$results = $wpdb->query($sql_insert);

/* code to select css values from database and write all css to style.css file */
$sql_DWidget = "Select * from ".$table_name;
$CssResponse = $wpdb->get_results($sql_DWidget);
foreach($CssResponse as $CssClass)
{
$descCss .= $CssClass->description.' ';
}

$blog_title = get_bloginfo('name'); // To display blog title
$template_path = get_option('template');

/* code to write style.css according to checkbox selection*/
$myFile = ABSPATH."/wp-content/plugins/hide-widget-title/style.css";
$fh = fopen($myFile, 'w') or die("can't open file");
fwrite($fh,$descCss);
fclose($fh);
echo 'Hide title from public users.';
}
?>


Adam W. Warner comments:

Hi Peter, at first this didn't work, but I was able to get working and I think this has uncovered something that I need to address with this plugin concerning how themes are displaying widgets.

I had to remove .widgettitle from this line:
$description .= "#".$title." ".$header_tag.".widgettitle {display:none!important;}\n";

In that screencast, the author added the "widgetitle" as the fix for their particular theme/css combo. After testing with your code and getting it to work and gteh's code below and that also working, it seems that I'll have to try and account for both instances of how the widget title css is rendered.

I think it would be correct to split the prize between the two of you or just make two awards. I'll figure out how to do that then post another question to adding an if statement to account for both widget title possibilities.

2011-01-20

Dan | gteh answers:

Try this:
$description = "#".$title." h3, #" . $title. " h2 #" . $title . "h1 { display:none; }";

and keep repeating for more tags


Dan | gteh comments:

I noticed that you are grabbing the ID of the widget using:


$description = "#".$title." h3 { display:none; }";


When using a text widget, the ID is not actually the title of the widget though. It numerates them as text-1, text-2. text-3 etc....

Just as a proof of concept, try editing that to do this:


$description = "#text-9 h3 { display:none; }";


just to see if the plugin is actually doing what it should.


Dan | gteh comments:

Sorry I meant



$description = "#text-9 h4 { display:none; }";



If that works then it will work for all H tags, you just need to find a way to grab the correct ID


Adam W. Warner comments:

This does work, and I am still doing some testing with the other code posted here. I discovered that I had to uncheck the hide button, save the widget, then recheck the hide button, save the widget.

At first I wasn't doing this and now I'm going to retry the other testing I did...

2011-01-20

Cosmin Popovici answers:

Why not just:

$title = $_GET['id'];

$description = "#".$title." h3, #".$title." h4, #".$title." h5 { display:none; }";


And so on... Did you try this?


Adam W. Warner comments:

No I didn't but will now and report back...


Cosmin Popovici comments:

Note that I've edited the code, since I wasn't closing the string correctly...


Cosmin Popovici comments:

Tested my code above and it works :)


Adam W. Warner comments:

This does not work for me with a theme with an h4 for widget title.

See widget here:
http://demo.adamwwarner.com/

Text widget under the email newsletter widget


Cosmin Popovici comments:

As I said, you need to continue that code.

<strong>Here's the complete code:</strong>

$title = $_GET['id'];

$description = "#".$title." h1, #".$title." h2, #".$title." h3, #".$title." h4, #".$title." h5, #".$title." h6 { display:none; }";


To see that it works, [[LINK href="http://www.wptuts.net/title.php"]]check this page[[/LINK]].


Adam W. Warner comments:

I'm sorry Cosmin, it's not working on the theme I am trying it on (the only theme I have using an h4 header tag).


Adam W. Warner comments:

I just discovered that even changing this:
$description = "#".$title." h3 { display:none; }";
to an h4 is not affecting this theme.

Hmmm, this is a Genesis child theme so maybe it's something different.

This is turning out to be a difficult thing to account for all themes and how the widget titles are styled...

I welcome any thoughts and will gladly increase the "prize" on this...


Cosmin Popovici comments:

Since I understand you want to hide ALL headings on widgets, why not just do it in the CSS file?

Have you tried that? Need any help with the CSS?

2011-01-20

John Cotton answers:

Apologies if this is really bad form and should really keep my mouth shut, but isn't this a very long-winded way of hiding titles?

Why doesn't the code just react the widget_title hook and return an empty string for titles that aren't wanted? You could just store a list of those in a settings field, negating the need for a custom table and the performance hit of sending out html that you then hide with extra css....

Just a thought...


Adam W. Warner comments:

Hi John,

Thanks for your comment, it may be a more efficient method to do as you suggest, but I had this plugin created for me and don't know enough about coding to enhance/change it at this time.