Change WordPress header color using customizer - wordpress

I have theme customize function in my customizer.php file:
function mytheme_customize_register( $wp_customize ) {
$wp_customize->get_setting( 'blogname' )->transport = 'postMessage';
$wp_customize->get_setting( 'blogdescription' )->transport = 'postMessage';
$wp_customize->get_setting( 'header_textcolor' )->transport = 'postMessage';
}
But I can't change header_textcolor using theme customizer. How can I use header text color value in my theme?
My header css:
.navbar-default .navbar-nav>.active>a {
color: #777;
background-color: transparent;
}

You can use the header_textcolor value by using get_theme_mod( 'header_textcolor' ) and use that value where applicable. For your specific solution, drop the following code somewhere in functions.php:
function my_styles_method() {
$color = get_theme_mod( 'header_textcolor' ); ?>
<style>
.navbar-default .navbar-nav>.active>a {
color: <?php echo esc_attr( $color ); ?>;
background-color: transparent;
}
</style>
<?php
}
add_action( 'wp_head', 'my_styles_method' );

Related

Force Woocommerce filter by attribute to show only attributes where search term is in title

I'm using the below code to make wordpress search only by product titles. However, the woocommerce "Filter by Attributes" widget still shows filters as if the search was done on body text too.
So for example if I search "face" the results that show up all have "face" in the title but the Filter By Attribute widget will still show Chocolate as an attribute because there is a chocolate bar that has a description "Face it, we all love chocolate"
Then if you click the "Chocolate" filter, it will show no results, because the search is only showing results with "face" in the title.
I don't even know where to begin looking to change the behaviour of the filter by attributes widget.
// Search titles only
function __search_by_title_only( $search, $wp_query )
{
global $wpdb;
if(empty($search)) {
return $search; // skip processing - no search term in query
}
$q = $wp_query->query_vars;
$n = !empty($q['exact']) ? '' : '%';
$search =
$searchand = '';
foreach ((array)$q['search_terms'] as $term) {
$term = esc_sql($wpdb->esc_like($term));
$search .= "{$searchand}($wpdb->posts.post_title LIKE '{$n}{$term}{$n}')";
$searchand = ' AND ';
}
if (!empty($search)) {
$search = " AND ({$search}) ";
if (!is_user_logged_in())
$search .= " AND ($wpdb->posts.post_password = '') ";
}
return $search;
}
add_filter('posts_search', '__search_by_title_only', 500, 2);
I've cobbled together my own filter that plays nice with the above search (only the titles) and doesn't show any Brands that have items that don't have the keyword in the title. My only issue now is figuring out how to get the count of items.
<?php
$searchterm = htmlentities($_GET["s"]);
$filter_brand = htmlentities($_GET["filter_brand"]);
$current = $_SERVER['REQUEST_URI'];
$site_url = home_url();
$args = array(
'post_type' => 'product',
'posts_per_page' => -1,
'order' => 'ASC',
'orderby' => 'title',
's' => $searchterm
);
// The Query
$the_query = new WP_Query( $args );
if( $the_query->have_posts() ) :
echo'<div id="woocommerce_layered_nav-3" class="widget woocommerce widget_layered_nav woocommerce-widget-layered-nav">
<ul class="woocommerce-widget-layered-nav-list">';
$unique_singler = array();
while ( $the_query->have_posts() ) : $the_query->the_post();
$brand_terms = get_the_terms( $post, 'pa_brand' );
$singler = array_values($brand_terms)[0];
$name = $singler->name;
$name_string = strtolower($name);
$name_slug = str_replace(" ","-",$name_string);
// only create option if city hasn't been added yet
if( ! in_array( $name, $unique_singler ) ) :
// add city to array so it doesn't repeat
$unique_singler[] = $name;
;?>
<li class="woocommerce-widget-layered-nav-list__item wc-layered-nav-term <?php if (!($filter_brand == $name_slug) && !empty($filter_brand)) { echo 'hidden'; }?>">
<?php echo '<a class="remover ';
if ($filter_brand == $name_slug) { echo 'shown'; }
echo '" href="'.$site_url.'/?s='.$searchterm.'&tags=1&ixwps=1&post_type=product"><i class="fas fa-times"></i></a>';
?><?php
echo '<a class="dup" href="'.$current.'&filter_brand='.$name_slug.'">'.$name.'</a> <span class="count">(' .count($XXXXXXX). ')</span>';
?></li>
<?php
endif;?>
<?php endwhile;?>
</ul>
</div>
<?php else :?>
<p>Nothing to see</p>
<?php endif; ?>
<style>
li.woocommerce-widget-layered-nav-list__item.wc-layered-nav-term a.remover {
display:none;
}
li.woocommerce-widget-layered-nav-list__item.wc-layered-nav-term a.remover.shown {
display:inline-block;
}
li.woocommerce-widget-layered-nav-list__item.wc-layered-nav-term.hidden
{
display:none;
}
.x-sidebar .widget ul li {
border-top: 1px solid rgba(0,0,0,0.085) !important;
}
ul.woocommerce-widget-layered-nav-list
{
border-top: 1px solid rgba(0,0,0,0.085) !important;
border-bottom: 1px solid rgba(0,0,0,0.085) !important;
}
.woocommerce-widget-layered-nav-list, li.woocommerce-widget-layered-nav-list__item.wc-layered-nav-term {
margin-left:0 !important;
}
.x-sidebar .widget ul li a {
padding-top: 8px;
padding-bottom: 8px;
}
div#woocommerce_layered_nav-3 {
margin: 0;
}
a.remover.shown i {
text-decoration: underline !important;
margin-right:0.5em;
}
</style>

Customize cart item removed notice in Woocommerce 3

I am using the WooCommerce 3.4.4 version and I am trying to edit the notice message when you press the "X" button to remove the product from the cart page.
Currently the notice is "<product name>" removed. Undo?
I want to remove the quotations and change the message to Product name has been removed. [Undo button]
I have managed to remove the quotation marks from the product name by writing
add_filter( 'woocommerce_cart_item_removed_title', 'removed_from_cart', 10, 2);
function removed_from_cart( $message, $product_data ) {
$product = get_the_title($product_data['product_id']);
$message = $product;
return $message;
}
But I am a bit confused on how to do the rest of the edits. Any help is appreciated.
Updated
The only available hook is woocommerce_cart_item_removed_title that you are using already. and displays the product name between quotes. You can also use gettex filter hook to remove the ? after "Undo" text:
add_filter( 'woocommerce_cart_item_removed_title', 'removed_from_cart_title', 12, 2);
function removed_from_cart_title( $message, $cart_item ) {
$product = wc_get_product( $cart_item['product_id'] );
if( $product )
$message = sprintf( __('Product %s has been'), $product->get_name() );
return $message;
}
add_filter('gettext', 'cart_undo_translation', 35, 3 );
function cart_undo_translation( $translation, $text, $domain ) {
if( $text === 'Undo?' ) {
$translation = __( 'Undo', $domain );
}
return $translation;
}
Code goes in function.php file of your active child theme (or active theme). Tested and works.
But you can not change or add button tag class the the <a> html tag…
Instead use the existing restore-item tag class adding some custom CSS styles to it.
Below some CSS styles example, that you can add to the styles.css file of your active child theme:
.woocommerce-message .restore-item, {
float: right;
padding: 0 0 0 1em;
background: 0 0;
color: #fff;
box-shadow: none;
line-height: 1.618;
border-width: 0 0 0 1px;
border-left-style: solid;
border-left-color: rgba(255,255,255,.25)!important;
border-radius: 0;
}
.woocommerce-message .restore-item:hover {
background: 0 0;
color: #fff;
opacity: .8;
}
This is what you will get:

Change Button Style When Stock is Over Woocommerce

I'm trying to do a hook to change the style of the buy button when the product is without stock.
I have done something like this, but without success.
do_action( 'woocommerce_no_stock', $product );
function action_woocommerce_no_stock( $product ) { ?>
<style>
.btn-assine {
background: blue;
}
</style>
<?php
};
add_action( 'woocommerce_no_stock', 'action_woocommerce_no_stock');
Usually Woocommerce removes the button if the product is out-of-stock. If your product settings is allowing backorders then you'll see the button and probably the CSS class for this button will be different from the others.
Please Try Below Code.
do_action( 'woocommerce_no_stock', $product );
function action_woocommerce_no_stock( $product ) { 
echo '
<style type="text/css">
.single-product .product .single_add_to_cart_button.button{
background-color: #333333;
color: #FFFFFF;
}
.woocommerce .product .add_to_cart_button.button{
background-color: #333333;
color: #FFFFFF;
}
</style>
';
}; 
add_action( 'woocommerce_no_stock', 'action_woocommerce_no_stock', 10, 1 );

How to display block or trigger the style on Woocommerce if !is_in_stock

I am trying to display a block or DIV when the product is out of stock but the condition does not appear to work
add_action( 'woocommerce_get_availability', 'display_welcome', 10);
function display_welcome() {
global $_product;
if ( ! $_product->is_in_stock() ) {
?>
<style>
#hello {display:block }
</style>
<?
}
}
html
<div id="hello">Try this product instead</div>
add_action('woocommerce_get_availability', 'display_welcome', 10, 2);
function display_welcome($availability_class, $_product) {
if ($availability_class['availability'] == 'Out of stock') {
$availability_class['class'] = $availability_class['class'] . ' my-customclass';
add_action('woocommerce_single_product_summary', 'hooks_add_div', 33);
function hooks_add_div() {
echo '<div id="helllo">mujeebu rahman</div>';
}
}
}

Wordpress Settings API two sections same page save error

Hi I am just learning to work with the settings API and I cant seem to get to sections on the same page to work.The first section works perfetly and saves the daya but the second displays an error on save :
Options Page not Found
This is the code for my entire options page:
<?php
/* ------------------------------------------------------------------------ *
* REGISTER MENU AND SUBMENU
* ------------------------------------------------------------------------ */
function thanathos_theme_menu()
{
add_menu_page('Thanathos',
'Thanathos',
'administrator',
'thanathos_menu_id',
'thanathos_display'
);
}
add_action('admin_menu', 'thanathos_theme_menu');
/*------------------------------------------------------------------------ *
* Social & Logo Options
* ------------------------------------------------------------------------ */
function thanathos_initialize_frontpage_options()
{
if (false == get_option('thanathos_front_page_options')) {
add_option('thanathos_front_page_options');
}
add_settings_section(
'thanathos_front_page',
'',
'thanathos_front_page_section_callback',
'thanathos_front_page_options'
);
add_settings_field(
'logo_path',
'Logo Path',
'thanathos_logo_path_url_callback',
'thanathos_front_page_options',
'thanathos_front_page'
);
register_setting(
'thanathos_front_page_options',
'thanathos_front_page_options',
'thanathos_front_page_options_sanitize'
);
}
add_action('admin_init', 'thanathos_initialize_frontpage_options');
function thanathos_front_page_section_callback()
{
}
function thanathos_logo_path_url_callback()
{
$options = get_option('thanathos_front_page_options');
echo '<input type="text" id="logo" name="thanathos_front_page_options[logo_path]" value="' . $options['logo_path'] . '" />';
}
function thanathos_front_page_options_sanitize($input)
{
$output = array();
foreach ($input as $key => $val) {
if (isset($input[$key])) {
$output[$key] = strip_tags(stripslashes($input[$key]));
}
}
return apply_filters('thanathos_front_page_options', $output, $input);
}
/* ------------------------------------------------------------------------ *
* Slider Options
* ------------------------------------------------------------------------ */
function thanathos_front_page_slider_options()
{
if (false == get_option('thanathos_front_page_slider')) {
add_option('thanathos_front_page_slider');
}
add_settings_section('thanathos_front_page_slider',
'',
'thanathos_front_page_slider_callback',
'thanathos_display',
'thanathos_front_page_slider'
);
}
add_action('admin_init', 'thanathos_front_page_slider_options');
function thanathos_front_page_slider_callback()
{
}
/* ------------------------------------------------------------------------ *
* Display on Thanathos Menu Page
* ------------------------------------------------------------------------ */
function thanathos_display()
{
?>
<style>
fieldset {
border: 1px solid #ddd;
margin-top: 20px;
padding-bottom: 20px;
}
legend {
margin-left: 5px;
padding: 0 5px;
color: #2481C6;
text-transform: uppercase;
}
p.submit {
margin-left: 10px;
}
td input {
width: 360px;
}
</style>
<div class="wrap">
<div id="icon-themes" class="icon32"></div>
<h2>Thanathos General Options</h2>
<?php settings_errors(); ?>
<form method="post" action="options.php">
<fieldset>
<legend><strong>Logo and Social Options</strong></legend>
<?php
settings_fields('thanathos_front_page_options');
do_settings_sections('thanathos_front_page_options');
?>
</fieldset>
<?php submit_button(); ?>
</form>
<form method="post" action="options.php">
<fieldset>
<legend><strong>Slider Options</strong></legend>
<?php
settings_fields('thanathos_front_page_slider');
do_settings_sections('thanathos_front_page_slider');
?>
</fieldset>
<?php submit_button(); ?>
</form>
</div>
<?php
}
?>
If this is not the corect approch of adding two sections to the same page then what is?
Below is an excellent tutorial for the settings api. Altough a bit long if you want to do it as a whole.
In part 5 it explains why you can't have 2 settings_sections on one page.
The solution: use tabs.
This will help you with your problem.
http://wp.tutsplus.com/tutorials/the-complete-guide-to-the-wordpress-settings-api-part-1/

Resources