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>
Related
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 3 years ago.
Improve this question
I am starting a cart session on my cart page but cart dropdown is not updating with a count until I refresh the page. I just want to update the div without reloading.
I am using foreach but it doesn't work. What should I do now.
<?php
session_start();
require_once("product.php");
?>
<li class="header-cart dropdown default-dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" aria-expanded="true">
<div class="header-btns-icon">
<i class="fa fa-shopping-cart"></i>
<?php
if(isset($_SESSION['cart'])){
?>
<span class="qty"><?php echo count($_SESSION['cart'])?></span>
<?php
}else{
?>
<span class="qty">0</span>
<?php
}
?>
</div>
<strong class="text-uppercase">My Cart:</strong>
<br>
<span>Shop Now</span>
</a>
<div class="custom-menu">
<div id="shopping-cart">
<div class="shopping-cart-list">
<?php
#$cart = unserialize(serialize($_SESSION['cart']));
$total = 0;
if($cart){
foreach($cart as $k=>$v)
{
$total += $v->price * $v->quantity;
?>
<div class="product product-widget">
<div class="product-thumb">
<img src="<?php echo $v->img;?>" height="50" width="60" alt="">
</div>
<div class="product-body">
<h3 class="product-price"><?php echo $v->price;?> <span class="qty">x1</span></h3>
<h2 class="product-name"><?php echo $v->name;?></h2>
</div>
<button class="cancel-btn" style="margin-right:8px;"><i class="fa fa-trash"></i></button>
<?php }
?>
<div class="shopping-cart-btns">
<button class="main-btn">View Cart</button>
<button class="primary-btn" style="margin-left:15px;">Checkout <i class="fa fa-arrow-circle-right"></i></button>
</div>
<?php
}
else{
echo '<p style="color: red;">No Product is added in your cart</p>';
}
?>
</div>
</div>
</li>
I want to update the cart div when I click on Add to cart.
As you have not provided enough code to work with, I will post the concept and hope you will be able to do it, also comment if you have any more doubts I'm always open to help
So firstly you need to write a function that asynchronously fetches
the data - Which means it fetches the data without having the page to
reload.
So you need to write the PHP code in a PHP file instead of in the HTML page, for example,
cart.php or where ever you have written your query to fetch the count
of the cart from database.
Once you have done that then you need to write an AJAX call to the
button of Add to Cart, So when you click on add to cart, it triggers
the ajax request and fetches the data from the backend which is
passed from your cart.php
for example , write this code inside your add to cart button
fetch("cart.php")
.then(res=>res.json)
.then(res=>{
//You will get the count here and just append it inside the tag where your count is displayed
//For example :
count.innerHTML = res
})
Don't forget to json_encode($count); in the PHP file so that you can receive the data in JSON format
I am trying to create a message form into a bootstrap modal by Passing the user username/id to the modal for identification.
here is an html/php code that made a list of registered users.
<div class="col-lg-4 col-md-4 col-sm-4 mb">
<div class="content" style="margin-bottom:5px;">
<ul class=" extended inbox">
<div class="notify-arrow notify-arrow-green"></div>
<li>
<p class="green">People you can follow</p>
</li>
<?php
//Show all users
foreach ($users as $row) {
?>
<li style="padding:3px; margin-bottom:3px; width:100%; background:#CF9;">
<a href="index.html#">
<span class="photo" style="float:left; padding:4px;"><img alt="avatar" src="uploads/<?php echo $row['pix']; ?>" width="50" height="50"></span>
<span class="subject" style="float:left;">
<span class="from">
<?php
echo ''.$row['user_lastname']. ' '.$row['user_firstname'].'';
?>
<a class="" data-toggle="modal" data-target="#profile_pic_modal"><span class="glyphicon glyphicon-comment"></span></a>
</span><br>
<span class="time">
<?php
echo (($row['receiver'] === $row['user_id'] && $row['sender'] === $user_id)
? '<button class="btn follow following " rel="'.$row['user_id'].'">Following</button>'
:' <button class="btn follow" rel="'.$row['user_id'].'">
<i class="fa fa-user-plus alert-info"></i> Follow </button>');
?>
</span>
</span>
</a>
</li><br>
<?php
}
?>
</ul>
</div>
When a user click on another user's message icon he/she should be able to send message. Could someone please show me how to do this using php/mysqli and ajax
First add a data-(anyName) tag like below
<?php $ID = 'The persons Username'; ?>
<a href='#' class='btn btn-warning btn-xs open-AddBookDialog' data-id='$ID' data-toggle='modal'>My Modal</a>
Then put a input tag inside your modal body with a ID of example(MyID)
<input type="text" id="MyID">
Then using the code below (jquery) this will pass the value of data-id into that input tag on modal show.
$(document).on("click", ".open-AddBookDialog", function () {
var myId = $(this).data('id');
$(".modal-body #bMyID").val(myId);
$('#myModal').modal('show');
});
Information like username (login?) and id of a logged user should be disposed by Session, unlike you have good reasons for not do that. When the user enters in the system, you will already load a bunch of data to be sure he is valid, so the practical way to not retrieving always all the data from the user logged in, that are currently using your system, it's always good to use SESSIONs to handle that (imagine a ton of users using your system and you needing to retrieve each of them to each click and routine inside the system).
In a practical way, just open your modal and validate your routine using the started session with the user information settled in.
To clarify about the OTHERS users data (those listed that the current user will click to send a message) you can have to methods:
YOUR HTML:
<a href="#" data-userid='<?= $row['user_id']; ?>'>
<span class="photo" style="float:left; padding:4px;"><img alt="avatar" src="uploads/<?php echo $row['pix']; ?>" width="50" height="50"></span>
<span class="subject" style="float:left;">
<span class="from">
<?php
echo ''.$row['user_lastname']. ' '.$row['user_firstname'].'';
?>
<a class="" data-toggle="modal" data-target="#profile_pic_modal"><span class="glyphicon glyphicon-comment"></span></a>
</span><br>
<span class="time">
<?php
echo (($row['receiver'] === $row['user_id'] && $row['sender'] === $user_id)
? '<button class="btn follow following " rel="'.$row['user_id'].'">Following</button>'
:' <button class="btn follow" rel="'.$row['user_id'].'">
<i class="fa fa-user-plus alert-info"></i> Follow </button>');
?>
</span>
</span>
</a>
#Modal (Assuming you're using v4)
<div class="modal hide fade" id="user-message">
<div class="modal-header">
<button class="close" data-dismiss="modal">×</button>
<h3 class="hdrtitle">Hey <?= $_SESSION['login']; ?>, Send message to <span></span></h3>
</div>
<div class="modal-body">
<label for='msg'>Message:</label>
<textarea id='msg' rows="4" cols="50" name='msg'></textarea>
<button id='send-msg'>Send Msg</button>
</div>
</div>
and then showing it with:
$('a').on('click', function(){
//retrieve all other user data
$.get( "yourcode.php?userid=" + $(this).data('userid'), function( data ) {
$('.modal h3 span').html(data.username);
//FILL YOUR MODAL AS YOU WISH
$('.modal').modal('toggle');
});
});
But the best way is to click and mount the modal in a partial view bringing the HTML already mounted with all information you want just to trigger the modal routine, avoiding html structure that the user don't really needs at first time access the page.
$('a').on('click', function(){
//retrieve all other user data
$.get( "partialmodal-sendmsg.php?userid=" + $(this).data('userid'), function( data ) {
$('body').append(data);
//FILL YOUR MODAL AS YOU WISH
$('.modal').modal('toggle');
});
});
Some must reads about:
When should I use session variables instead of cookies?
http://cse.unl.edu/~riedesel/pub/cse413/Project%202/SESSION.pdf
I am trying to remove the default divs that are wrapped around with the Wordpress Social Login plugin.
This is what is output by default:
<div class="wp-social-login-widget">
<div class="wp-social-login-connect-with">{connect_with_caption}</div>
<div class="wp-social-login-provider-list">
<a class="wp-social-login-provider wp-social-login-provider-facebook">
<img src="{provider_icon_facebook}" />
</a>
<a class="wp-social-login-provider wp-social-login-provider-google">
<img src="{provider_icon_google}" />
</a>
<a class="wp-social-login-provider wp-social-login-provider-twitter">
<img src="{provider_icon_twitter}" />
</a>
</div> <!-- / div.wp-social-login-connect-options -->
<div class="wp-social-login-widget-clearing"></div>
</div> <!-- / div.wp-social-login-widget -->
I'd like to get rid of all the divs and classes associated with the anchors. So that I can style it using my own theme.
I have found the file that generates those tags - but don't want to directly edit the plugin file wsl.auth.widgets.php because when it's updated then I'll have to continuously change it, removing with css display:none; might be an option but I would prefer writing something in the functions.php file so that it's permanent.
I've seen this function which changes the anchors only not sure how to go about removing the divs as well.
function wsl_use_fontawesome_icons( $provider_id, $provider_name, $authenticate_url )
{
?>
<a
rel = "nofollow"
href = "<?php echo $authenticate_url; ?>"
data-provider = "<?php echo $provider_id ?>"
class = "wp-social-login-provider wp-social-login-provider-<?php echo strtolower( $provider_id ); ?>"
>
<span>
<i class="fa fa-<?php echo strtolower( $provider_id ); ?>"></i>
Sign in with <?php echo $provider_name; ?>
</span>
</a>
<?php
}
add_filter( 'wsl_render_auth_widget_alter_provider_icon_markup', 'wsl_use_fontawesome_icons', 10, 3 );
Any help would be appreciated, thanks.
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>
I am trying to create a jQuery function that will allow me to add, edit, and delete articles on my site. Right now, I am trying to write the delete functionality. Basically, when the delete button is clicked, it will send the id of that specific article to a php script via ajax request. It gets the article ID from the ID attribute of the article element.
My problem is, that when the Delete button is clicked I get an alert box with the article ID on the first article, but not on the rest.
Here is my code:
HTML/PHP:
<div id="contentLeft">
<?php
foreach($data->blogPosts as $post){
?>
<article id="<?php print $post->ID; ?>" class="article">
<div id="options">
<div id="edit"><a class="btn btn-danger" href="#" id="editButton"><i class="fa fa-pencil"> Edit</i></a></div>
<div id="delete"><a class="btn btn-danger" href="#" id="deleteButton"><i class="fa fa-trash-o">Delete</a></i></div>
</div>
<div id="articleTitle"><?php echo $post->Title; ?></div>
<div id="content">
<?php echo $post->Content; ?>
</div>
<div id="date"><?php echo date('F jS, Y', strtotime($post->Date)); ?></div>
</article>
<?php
}
?>
</div>
My jQuery:
$("#deleteButton").bind('click', function(){
var id = $("article").closest("article").attr("id");
alert(id);
});
I appreciate the help!
In a given document ids should be unique; no more than one element should have the same ID. Please change your id's to classes and change your js accordingly:
HTML
<a class="btn btn-danger deleteButton" href="#"> ....
JS
$(".deleteButton").bind('click',...
You can add only one element with the same id.
Probably you should change id to class:
<div class="delete"><a class="btn btn-danger" href="#" class="deleteButton"><i class="fa fa-trash-o">Delete</a></i></div>
and in your js code:
$(".deleteButton").bind(...)