Fantastic add-on to an already amazing plugin.
Is there a way to retrieve the ID of a Menu Item and print it in the HTML output? I’d like to allow the Admin user to simply select a checkbox with the LABEL ‘Enable Full Width’ on menu items within the Menu Manager, which I’ve created using the field type ‘Checkbox’ with field name ‘full_width_menu_item’. So far, so good.
Where I’m struggling is how to get the ID of menu items that have the check box enabled so that I can apply custom styling, e.g.
<style>
<?php [get the ID of each menu item with 'full_width_menu_item' selected]; ?> {
background:red;
}
</style>
so that the HTML output would be:
<style>
.menu-item-7465, .menu-item-1234 {
background:red;
}
</style>
Any help will be greatly appreciated.
Here’s a custom PHP solution that we’ve used for one of our projects, so that we don’t require another additional plugin. You should only need to replace ‘final_section_text_background’ with your own custom field name. Opacity value can be adjusted using $rgba = hex2rgba($color, 0.8); – replacing 0.8 with your own preferred opacity level.
<?php if( get_field('final_section_text_background') ): ?>
<?php /* Convert hexdec color string to rgb(a) string */
function hex2rgba($color, $opacity = false) {
$default = 'rgb(0,0,0)';
//Return default if no color provided
if(empty($color))
return $default;
//Sanitize $color if "#" is provided
if ($color[0] == '#' ) {
$color = substr( $color, 1 );
}
//Check if color has 6 or 3 characters and get values
if (strlen($color) == 6) {
$hex = array( $color[0] . $color[1], $color[2] . $color[3], $color[4] . $color[5] );
} elseif ( strlen( $color ) == 3 ) {
$hex = array( $color[0] . $color[0], $color[1] . $color[1], $color[2] . $color[2] );
} else {
return $default;
}
//Convert hexadec to rgb
$rgb = array_map('hexdec', $hex);
//Check if opacity is set(rgba or rgb)
if($opacity){
if(abs($opacity) > 1)
$opacity = 1.0;
$output = 'rgba('.implode(",",$rgb).','.$opacity.')';
} else {
$output = 'rgb('.implode(",",$rgb).')';
}
//Return rgb(a) color string
return $output;
}
/* Here's a usage example how to use this function for dynamicaly created CSS */
$setColor = get_field('final_section_text_background');
$color = $setColor;
$rgb = hex2rgba($color);
$rgba = hex2rgba($color, 0.8);
?>
.final-section .valign-middle {background:<?php echo $rgba ?>;}
<?php endif; ?>
