Change location of wc_print_notice in Woocommerce cart - woocommerce

When I update my cart (remove product or change quantity) I get a green update message inside the cart table:
.
Now I would like to get this message outside the table in full width as you can see with the coupon code example:
I know it has something to do with the hooks woocommerce_before_cart_table and woocommerce_before_cart.
This is the div line I want to reposition:
<div class="woocommerce-message message-wrapper" role="alert">
<div class="message-container container success-color medium-text-center">
<i class="icon-checkmark"></i>Cart updated.
</div>
Update:
This is a snipped of my themes cart.php.
do_action( 'woocommerce_before_cart' ); ?>
<?php wc_print_notices(); ?>
<div class="woocommerce row <?php echo $row_classes; ?>">
<div class="col large-7 pb-0 <?php echo $main_classes; ?>">
wc_print_notice is placed in the right position. This did change the coupon code to go full width but not the updated cart messages.

Related

How to position output of gravity forms dynamic output?

I'm simply trying to use the value from a Gravity Forms dynamically populated URL parameter as the ID for getting a custom field from Advanced Custom Fields. Using it like this returns the result within the of the content.
What is the best way to hook this such that it appears below the form. I've tried inserting the filter into the page template itself to no avail.
<?php
add_filter('gform_field_value_subclass', 'my_custom_population_function');
function my_custom_population_function($value)
{
$repair = get_field('repair', $value);
$report = get_field('report', $value);
if ($repair && $report) : ?>
<section class="rrr">
<div class="row">
<div class="repair">
<div class="r-wrap">
<h2 class="bracket-heading"><span>Step 2:</span>Report</h2>
<?php echo $repair ?>
</div>
</div>
<div class="recognize">
<div class="r-wrap">
<h2 class="bracket-heading"><span>Step 1:</span>Immediate Action Steps</h2>
<?php echo $report; ?>
</div>
</div>
</div>
</section>
<?php endif;
} ?>
I actually realized that something didn't feel right after looking over the first 20 pages of Google and not seeing a reference to this use case. The filters in Gravity Forms are more suited towards dynamic population of other fields, not to set context for the site as a whole. At least that's what it appears.
I found the better solution to be using query_vars.
In functions.php, I made it so that the URL parameter called subclass can be queried from Wordpress itself.
<?php
// add `author_more` to query vars
add_filter( 'init', 'add_subclass_query_var' );
function add_subclass_query_var()
{
global $wp;
$wp->add_query_var( 'subclass' );
}
?>
And then in my page template file, I grab that value that I need to set the ID of the field from the URL using get_query_var().
The rest is pretty straightforward and just prints the field values out where I need them.
<?php
$value = get_query_var('subclass');
$repair = get_field('repair', $value);
$report = get_field('report', $value);
if ($repair && $report) : ?>
<section class="rrr">
<div class="row">
<div class="repair">
<div class="r-wrap">
<h2 class="bracket-heading"><span>Step 2:</span>Report</h2>
<?php echo $repair ?>
</div>
</div>
<div class="recognize">
<div class="r-wrap">
<h2 class="bracket-heading"><span>Step 1:</span>Immediate Action Steps</h2>
<?php echo $report; ?>
</div>
</div>
</div>
</section>
<?php else:
echo "No Results Found"
?>
<?php endif; ?>
https://codex.wordpress.org/WordPress_Query_Vars

WooCommerce products shortcode outputs class="columns-x" twice

Just a vanilla call to product-category shortcode in functions.php is confusing me.
I'm trying to get a columns-3 of text sitting next to a columns-9 of products.
My code:
<div class="content">
<div class="columns-3">
<?php $home_kit = get_term(30, 'product_cat', ARRAY_A); ?>
<h2 class="section-title"><?php echo $home_kit['name']; ?></h2>
<p><?php echo $home_kit['description']; ?></p>
All Products ยป
</div>
<?php echo do_shortcode('[product_category category="home-kits" per_page="3" orderby="price" order="desc" columns="9"]'); ?>
</div>
The shortcode generates:
<div class="homepage-home-kit-category">
<div class="content">
<div class="columns-3">
<h2...</h2>
<p>...</p>
<a ...</a>
</div>
<div class="woocommerce columns-9 ">
<ul class="products columns-9">
<li></li>
</ul>
</div>
</div>
</div>
Note the repeat of the columns-9 on both the generated <div> and <ul>.
If both the <div> and <ul> have class columns-9 then I get 3/4 of the available 3/4.
Surely the class columns-9 only needs to be on either the WooComerce <div> or the <ul>.
How can I remove this addition from the <ul> element?
I am gratefull for the answers I received which are all valid and work well.
I suppose my underlying problem is that I cannot see the usefulness of the product_category shortcode as it does not obey the columns parameter faithfully.
Am I alone?
There are several options to remove/modify the columns-9 class from the <ul> element
Solution 1 - Through the use of a filter hook.
function filter_woocommerce_product_loop_start( $loop_start ) {
// New output
$loop_start = '<ul class="products">';
return $loop_start;
}
add_filter( 'woocommerce_product_loop_start', 'filter_woocommerce_product_loop_start', 10, 1 );
Solution 2 - Overwriting the template file.
You could overwrite the templates/loop/loop-start.php template file
This template can be overridden by copying it to yourtheme/woocommerce/loop/loop-start.php.
Replace
<ul class="products columns-<?php echo esc_attr( wc_get_loop_prop( 'columns' ) ); ?>">
With
<ul class="products">
Solution 3 - overwriting the existing function.
Since woocommerce_product_loop_start uses function_exits, see: includes/wc-template-functions.php on line 1110-1134 #version 2.5.0
More info: What's "function_exists" in Wordpress
/**
* Output the start of a product loop. By default this is a UL.
*
* #param bool $echo Should echo?.
* #return string
*/
function woocommerce_product_loop_start( $echo = true ) {
$loop_start = '<ul class="products">';
if ( $echo ) {
// phpcs:ignore WordPress.Security.EscapeOutput.OutputNotEscaped
echo $loop_start;
} else {
return $loop_start;
}
}

Change Woocommerce cart page title text

I am trying to change the cart page title text from "Cart" to "My Cart"
The html shows as:
<header class="entry-header"><h1 class="entry-title">Cart</h1></header>
This code is being outputed by the:
<header class="entry-header">
<?php the_title( '<h1 class="entry-title">', '</h1>' );?>
</header>
I dont know where woocommerce/wordpress stores the text "cart" that is injected into the above code by the function the_title()
I was thinking the solution might be to use the function is_cart() to change the title to my preferred text if user is on cart page, but my PHP skills not taking me further. Cheers.

Building wordpress one-page portfolio with additional image gallery

I'm creating a custom theme with bootstrap that will be used by a photographer and I'm trying to integrate it with wordpress. My main page is in the one-page style and has following sections:
cover image with page title and description
about me section
portfolio with 6 exemplary photos and link to full gallery
contact form
"About me" content can be edited in the admin panel (I created a separate "about me" page and linked up its ID with the section), portfolio photos are the featured images of the latest posts.
Navbar consists of sections titles as well as link to the gallery.
And here are my questions and problems that I need to solve:
1) How can I add a functionality to edit the cover image from the admin panel?
2) How can I display only posts from one category?
I thought about categorizing the posts with "gallery" and "portfolio" when all of the first ones would be posted in gallery, but also some of them would be featured on the home page in portfolio section.
Is it a good way to do that? How can it be achieved in code? Here is how the portfolio code looks like at the moment:
<div class="row">
<?php
$i = 1;
query_posts('showposts=6');
query_posts("catname=portfolio");
if ( have_posts() ) : while ( have_posts() ) : the_post();
?>
<div class="col-sm-4 portfolio-item">
<a href="#portfolioModal<?php echo $i; ?>" class="portfolio-link" data-toggle="modal">
<div class="caption">
<div class="caption-content">
<i class="fa fa-search-plus fa-3x"></i>
</div>
</div>
<?php
the_post_thumbnail( 'full', array('class' => 'img-responsive') );
?>
</a>
</div>
<?php $i++; ?>
<?php endwhile; endif; ?>
It publishes all of the featured images of the posts in the portfolio section. What shall I add there to display only posts categorized as 'portfolio'?
3) What is the best way to create a separate gallery in my case?
Should I create the "index.php" file with all of the code in "../gallery" folder and link it up in navbar? What should be the link destination in navbar that would lead to the gallery?

Changing Default Title on WooCommerce Single Products Pages

I suppose this is something simple, but couldn't find a solution anywhere.
Currently, my website shows <h1>"Products"</h1> title on shop archive page, but on single product pages as well. Is it possible to change default title on single product pages to product name?
Here is my website. As you can see, above breadcrumbs, there is a default shop title. And there I want to display, product name instead.
<section class="<?php echo esc_attr($class_name) ?>" <?php echo wp_kses_post($bg_style); ?>>
<div class="page-title-inner">
<div class="container"><h1><?php echo esc_html($page_title); ?></h1> <?php great_store_the_breadcrumb(); ?>
</div>
</div>
</section>

Resources