Adding a cart to the nav bar

RW 8.7. Depth theme. RapidcartPro. Trying to switch to Yuzool Nav stack. Having problems with the branding part, but that’s a separate issue. The Depth theme won’t display the font awesome correctly on the menu throughout the site. Had a previous post on this with some help but it didn’t solve the problem.

I’d like to add a cart to the Nav bar. https://rjhoney.com/test/

I found this code. Had to take the < out and and & before nbsp to make it display in the post.

div id=“cartTotal” class=“cartTotal”>
a href="">
i class=“fa fa-shopping-cart”>
nbsp;span class=""></span
/a>
/div>

Will it do what I want? Where would I place it? I’ve tried in the stack CSS box, HTML Code CSS but it does not give the desired result.

Level of experience. Beekeeper who does the web site. Can’t write code. Not afraid to monkey around with things.

Jeff,

Might help if you told us where you found the code?

I don’t have RCP other than the demo version, but see if this post will help with the cart (This is for Foundation 6, but might work similarly with Navigation stack):



As for FA not working on all pages, it looks like you are getting a 404 on the web fonts for FA on the RCP pages:

Also, if you want to post code on this forum, if you select it and mark it as pre-formatted text ⌘ Cmd+⇧ Shift+C or the button above where you type </> Next to the big .

Came from https://themeflood.com/knowledgebase/topic/rapidcart-pro-setup/

I’m not using Boutique yet.

Any idea why I am getting the 404?

And I appreciate the help, really do.

Well,

https://rjhoney.com/test/rw_common/plugins/rapidcartpro/fonts/fontawesome-webfont.woff2
https://rjhoney.com/test/rw_common/plugins/rapidcartpro/fonts/fontawesome-webfont.woff
https://rjhoney.com/test/rw_common/plugins/rapidcartpro/fonts/fontawesome-webfont.ttf 

Aren’t there, since they appear to be part of the RCP plugin, my guess is for some reason they didn’t get published. I’d try to republish all files maybe.

I don’t have access to the server, so can’t say for sure. I also noticed that if I try to click on the cart button, I get a JS error?

As for the code, I don’t know if that is specific for that theme. I know the demo project just uses an offsite page to add the cart to the RW navigation.

I am most likely a bit dull here, but I cannot find ‘Menu Item’ stack. I did a web search on ‘menu item stack’ and only got navigation stacks from various developers.

Ok. I opened the web developer window and found the 404 errors? Is this something I did or didn’t do? Or should I contact 4gnd?

About fa, I thought that entering it into the page name would make it ubiquitous throughout the site menu.

image

I did republish. Where are you clicking to get a JS error? I checked a couple pages and didn’t get any errors?

That post was for Foundation 6. if you want to add a cart to the menu in a traditional theme, you add an offsite page (not stacks page but offsite): set the page name (left sidebar) to:

<i class="uk-icon-shopping-basket uk-margin-right"></i><span class="rc-extras-cart-total"><?php echo $rc->extras->cartTotalLocalized; ?></span></span>

Then set the URL to the offsite page to store address.

1 Like

Created an offsite page. Put the code in. Republished all files. Tried the redirect box, too. The offsite page is not published as Show in navigation in General Settings.

Nothing shows up on the site.

Would the solution you are offering put the cart on all the pages or only on the RCP store page?

It should add it to every page assuming that you don’t have show in navigation unchecked. Just like any other page,

I’m strictly going on the RCP demo project, I don’t have RCP, but it works fine with the demo version and the demo project.

There are others who are more familiar with RCP, I think @TemplateRepo uses it.

I did check the publish box on the offsite page. It looks like a space was created for an icon but none shows up.

Thanks for your help. I learned a few things today. Makes it a good day.

I think it is the icon from the sample project that uses the uikit icons.

Might try and replace it with a Font awesome icon.

Try this

<i class="fa fa-shopping-cart" aria-hidden="true"></i><span class="rc-extras-cart-total"><?php echo $rc->extras->cartTotalLocalized; ?></span></span>
1 Like

First, I also used to be an HVAC controls programmer. This code doesn’t look very hard. Is there a good place to use as a learning resource?

And it did the job, except for needed spacing between the cart and total. I’ve seen carts with the total inside the cart. Possible with this? Perhaps related to the question above.

Here’s what it is like with the Depth theme menu. You can see the fa icons are missing, too. I really like the theme. I wish Joe W. hadn’t shelved it.

Thanks, again!

Hey Jeff @BooneCtyBeek,

If you just need to add FontAwesome to depth try this
In the code settings add the following line to the Head section:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

For The cart to work in the headers you will need to make every page php. The code above injects the money amnt using php. RW won’t automatically change the file extension from .html to .php since you are adding the php by hand.

As for the spacing you can try adding a non-breacking space &nbsp; between the amount and basket:

<i class="fa fa-shopping-cart" aria-hidden="true"></i>&nbsp;<span class="rc-extras-cart-total"><?php echo $rc->extras->cartTotalLocalized; ?></span></span>

You can also try some other FA baskets like this:

<i class="fa a-shopping-basket" aria-hidden="true"></i>&nbsp;<span class="rc-extras-cart-total"><?php echo $rc->extras->cartTotalLocalized; ?></span></span>
2 Likes

During my days as an HVAC controls guy customers would often ask, can you make the system (our company was a Schneider Ecostruxure rep) do this, do that? Well, yes, it could and I’d generally do what they asked for free. And now I feel like I am in the customer chair. And I am very grateful for your help.

The stylesheet code did the trick.

I’ll give the shopping cart codes a go.

As for the file name changing, this gets changed in General Settings>Filename>index.html to index.php?

I was also doing some searching on warehousing images and read Will’s ebook. He suggested a couple places to learn HTML. Sounds like a good idea during the cold Indiana winter.

For existing pages you’ll need to change the name in the page inspector from index.html to index.php. You will also need to delete the old .html files on the webserver manually with an FTP app or file manager.

For future files, you can change the default file extension to PHP in the advanced settings.

One other thing I think I remembered about RCP. If I remember correctly, you’ll need to put a shopping cart on every page if you want the cart total to work. Even if you hide it from being visible it needs to be there for the cart to work.

There are many ways to learn HTML, free, paid, books videos, and tutorials. The two (W3schools, and CodeAcademy) @willwood mentions are great resources. You can also find lots of stuff on youtube, Udemy, and online by searching. Don’t forget that html is only one part of what you should learn. You’ll probably use CSS as much or more than html.
I’d also suggest that you learn to use the chrome developers tools. Udemy has a pretty good free course on that. Firefox has great tools as well, Safari’s tools aren’t so bad either.

1 Like