logo
Welcome to our new AbleCommerce forums. As a guest, you may view the information here. To post to this forum, you must have a registered account with us, either as a new user evaluating AbleCommerce or an existing user of the application. For all questions related to the older version of Gold and earlier, please go to AbleCommerce Gold forum. Please use your AbleCommerce username and password to Login. New Registrations are disabled.

Notification

Icon
Error

Options
Go to last post Go to first unread
pdsteiner8198692  
#1 Posted : Friday, December 2, 2022 3:56:48 AM(UTC)
pdsteiner8198692

Rank: Member

Groups: Authorized User
Joined: 12/30/2020(UTC)
Posts: 13

Below is a screenshot of one of our products, the issue is that when looking at the page all of the options and things to select are off to the right 1/3 of the page. You can also access it here.

Q1. Any ideas how to fix it???

Q2. How to change the front menubar font???

Screen Shot 2022-12-02 at 11.46.39.png (438kb) downloaded 13 time(s).

Edited by user Friday, December 2, 2022 4:07:34 AM(UTC)  | Reason: Not specified

Wanna join the discussion?! Login to your AbleCommerce Forums forum account. New Registrations are disabled.

ray22901031  
#2 Posted : Friday, December 2, 2022 6:56:44 AM(UTC)
ray22901031

Rank: Advanced Member

Groups: Authorized User, Developers
Joined: 2/17/2019(UTC)
Posts: 830

Thanks: 3 times
Was thanked: 13 time(s) in 13 post(s)
For the item options, I believe you have to modify the "_BuyProductDialog.cshtml" view file. We don't like the options being displayed in two different divs for the reason you are describing.

We modified our file to display all options in a single div, so everything would align better.

Support can verify if that's the proper file that needs to be modified.

-Ray

PS: for the menu font I believe the class is "header.navbar .navbar-nav"

Edited by user Friday, December 2, 2022 7:06:56 AM(UTC)  | Reason: Not specified

pdsteiner8198692  
#3 Posted : Friday, December 2, 2022 9:49:56 AM(UTC)
pdsteiner8198692

Rank: Member

Groups: Authorized User
Joined: 12/30/2020(UTC)
Posts: 13

Thanks, Ray. Where should I put the CSS settings for the menu? I've tried to add the following class to the "Store Menu Light" in the "Add CSS Classes" field but it's not working, maybe it's the wrong place.

header.navbar .navbar-nav>li>a { font-size: 12px; }
ray22901031  
#4 Posted : Friday, December 2, 2022 10:59:33 AM(UTC)
ray22901031

Rank: Advanced Member

Groups: Authorized User, Developers
Joined: 2/17/2019(UTC)
Posts: 830

Thanks: 3 times
Was thanked: 13 time(s) in 13 post(s)
EVERYTHING that you do that changes a default style should be in a custom.css located in your default theme folder.

EVERYTHING !!!

If, for some reason, your custom.css does not alter a default theme set by Abelcommerce, use the "!important" tag.

If you do not follow this rule, and you start making a tremendous number of changes outside your custom.css file, there will be hell to pay when they come out with an update.

In my case, my custom.css file is so big, that I created a second file called custom-01.css.

I referenced the second file at the end of the first custom file. Furthermore, if your file becomes huge like ours, on the development server you have the regular file, and on the production server you have the optimize and minimize version.

If you use something like Cloudflare, this is done automatically for you if your settings are correct.

I hope this helps.
-Ray
pdsteiner8198692  
#5 Posted : Friday, December 2, 2022 3:04:29 PM(UTC)
pdsteiner8198692

Rank: Member

Groups: Authorized User
Joined: 12/30/2020(UTC)
Posts: 13

Thanks very much, Ray. It works. To change the product layout the file in question is BasicProduct.chtml (inner template).
ray22901031  
#6 Posted : Friday, December 2, 2022 3:19:37 PM(UTC)
ray22901031

Rank: Advanced Member

Groups: Authorized User, Developers
Joined: 2/17/2019(UTC)
Posts: 830

Thanks: 3 times
Was thanked: 13 time(s) in 13 post(s)
I'm glad it works, regarding the product layout, we did not change the inter template, we changed the partial view instead. If you ever need to change an inner template from Ablecommerce, make a copy instead and use that copy as your template for the products. Safer that way.

But whatever works for you,

-Ray

Edited by user Friday, December 2, 2022 3:22:13 PM(UTC)  | Reason: Not specified

Users browsing this topic
Forum Jump  
You cannot post new topics in this forum.
You cannot reply to topics in this forum.
You cannot delete your posts in this forum.
You cannot edit your posts in this forum.
You cannot create polls in this forum.
You cannot vote in polls in this forum.