I would like to make a section at the top of my page for customers to be able to access their cart. Is there a way of doing this?
Thanks
You can add view cart button anywhere you want, here is the simple html :
<div style="text-align: right;">
<p>
<a href="http://site_name/shop/cart/" class="button">View Cart
<a href="http://site_name/shop/checkout/" class="button checkout">Checkout
</p>
</div>
Related
I am trying to link to a specific part in my php page. I have tried all the other answers on here but none of them have helped my special problem. This is how I am trying to go to the link
<a href="<?php echo $userLoggedIn; ?>#posts_tab">
So when the user clicks the dropdown they see a list of things. One of those things being the word Profile and when the user clicks on their profile they go to their own personal profile. When they are there they have a list of items at the top that look like this:
So what I want to do is when they click the profile they are automatically on the Profile Posts tab. Like a default option. For some reason it's not working for me and I can't figure out why. Any help please ?
header.php:
<a href="<?php echo $userLoggedIn; ?>#posts_tab">
</a>
profile.php:
<a style="color: #000;" id="posts_tab" href="javascript:void(0)" onclick="openCity(event, 'Posts');">
<div class="w3-third tablink w3-bottombar w3-hover-light-grey w3-padding">
<center>Profile Posts</center>
</div>
</a>
I believe this is what you want, you need to let your profile page know that you want to load that part of profile.php, you can do it different ways I have used php and GET as example, I've sent a parameter on the URL and received it on profile.php
header.php
<a href="<?php echo $userLoggedIn; ?>?tab=posts_tab">
profile.php
<?php
$tab = $_GET["tab"];
if ($tab == "posts_tab"){
?><script>openCity(event, 'Posts');</script><?php
}
?>
<a style="color: #000;" id="posts_tab" href="javascript:void(0)" onclick="openCity(event, 'Posts');">
<div class="w3-third tablink w3-bottombar w3-hover-light-grey w3-padding">
<center>Profile Posts</center>
</div>
</a>
I would like to add some text under the "Place Order" button at WooCommerce checkout.
I'm using the woocommerce_review_order_after_submit hook:
add_action( 'woocommerce_review_order_after_submit', 'add_after_checkout_button' );
function add_after_checkout_button() {
echo '<p>By clicking on the purchase button, you agree to our Terms of Service and Privacy Policy</p>';
}
Result (screenshot): https://ibb.co/F38bxDf
Could someone please help me edit this code to:
Add some space at the top (between the text and the "Place Order"
button)
Center align the text
Turn "Terms of Service" and "Privacy Policy" into clickable links
Decrease the line-height of the text
Decrease the font size
Is there a way to give this text a CSS class so I can control the styling of it with custom CSS? Or is possible to somehow type the custom CSS in the code snippet itself?
EDIT:
I've got 2 pieces of code.
Nr 1:
add_action( 'woocommerce_review_order_after_submit', 'add_after_checkout_button' );
function add_after_checkout_button() {
echo '<p class="text-under-place-order">By clicking on the purchase button, you agree to our Terms of Service and Privacy Policy</p>';
}
and
Nr 2:
<script src="https://kit.fontawesome.com/5e15d2f246.js" crossorigin="anonymous"></script>
<div class="row">
<div class="column">
<i class="fas fa-lock"></i>
SSL encrypted payment
</div>
<div class="column">
<i class="fas fa-undo"></i>
100% money-back guarantee
</div>
</div>
Code snippet Nr 1 solves my initial question.
Code snippet Nr 2 is an addition to display "encrypted payment" and "money-back guarantee" above the text as per my request in the comments.
I don't know how to merge these 2 pieces of code into 1.
You could add a class like this:
function add_after_checkout_button() {
echo '<p class="yourClassName">By clicking on the purchase button, you agree to our Terms of Service and Privacy Policy</p>';
}
Or use css inline like this:
function add_after_checkout_button() {
echo '<p style="padding-top: 10px;">By clicking on the purchase button, you agree to our Terms of Service and Privacy Policy</p>';
}
To turn the text into links just use a Terms and Service tag inside, just like you already did with the <p>.
EDIT:
HTML and CSS code to add an "encrypted payment" and "money-back guarantee" as requested in the comments:
<script src="https://kit.fontawesome.com/5e15d2f246.js" crossorigin="anonymous"></script>
<div class="row">
<div class="column">
<i class="fas fa-lock"></i>
SSL encrypted payment
</div>
<div class="column">
<i class="fas fa-undo"></i>
100% money-back guarantee
</div>
</div>
.row {
display: flex;
text-align: center;
}
.column {
flex: 50%;
}
You should just add a class to your tag <p></p> and style it in your style.css file in your child theme.
For the links, just add tags around the words "Terms of Service" and "Privacy Policy"
My problem is with the mini-cart button.
When you click the mini-cart button it should redirect to the Cart Page and it's not working , same problem on mobile .
Here is the cart button code ,I have tried to fix it but I am no expert.
This is my test website.
<button href="<?php echo esc_url( WC()->cart->get_cart_url() ); ?>" class="ql_cart-btn">
<?php echo wp_kses_post( WC()->cart->get_cart_total() ); ?>
<span class="count">(<?php echo esc_html( WC()->cart->cart_contents_count );?>)</span>
<i class="ql-bag"></i>
<i class="ql-chevron-down"></i>
</button>
Mobile main issue
Issue :
Button never use a href so you need to make it working with javascript.
<button href="http://dev.ilikeprintful.com/new-ilikeprintful/cart/" class="ql_cart-btn">
or use
<a href="http://dev.ilikeprintful.com/new-ilikeprintful/cart/" class="ql_cart-btn">
<!-- Your code -->
</a>
Your existing code
<div class="ql_cart_wrap">
<a href="http://dev.ilikeprintful.com/new-ilikeprintful/cart/" class="ql_cart-btn">
<span class="woocommerce-Price-amount amount">
<span class="woocommerce-Price-currencySymbol">$</span>49.90</span>
<span class="count">(2)</span>
<i class="ql-bag"></i><i class="ql-chevron-down"></i>
</a>
<div id="ql_woo_cart">
</div><!-- /ql_woo_cart -->
</div>
How can I Redirect keep the code same
You can add onclick event to navigate through button.
<button onclick="location.href = 'http://dev.ilikeprintful.com/new-ilikeprintful/cart/';" >
//Your Code
</button>
I created a custom attribute 'Barebone SKU' and would like to add the product assigned to this SKU to cart by clicking on 'Buy Barebone Only' as shown on this page http://62.100.204.242/~beta3d/bundle-test.html
I'm not good at coding but here's what I've tried so far
<?php if ($_product->getTypeId() === 'bundle'):?>
<div class="add-to-cart-buttons" style="margin-bottom:10px; float:none;">
<button type="button" title="Buy barebone only" style="padding:10px 0px;" class="button btn-cart" onclick="setLocation('<?php echo $this->getAddToCartUrl($_product->getBbsku) ?>')">Buy barebone/system only</button>
</div>
I am creating a cart link for my mobile header. I just want to show number of cart items after the cart icon. No text, only a number.
How can I do it?
My code is something like this:
<div class="mobile-cart">
<a href="mywebsite.com/cart">
<img src="cart.png">
Here should be the code for no. of items
</a>
</div>
Thanks.
You just need to use the method get_cart_contents_count() from WC_cart class, this way:
<div class="mobile-cart">
<a href="mywebsite.com/cart">
<img src="cart.png">
<span><?php echo WC()->cart->get_cart_contents_count( ); ?></span>
</a>
</div>
Reference: WC_Cart class - get_cart_contents_count() method