You are viewing this forum as a guest. Login to an existing account, or create a new account, to reply to topics and to create new topics.
Pages: 1 2
I've moved the Categories section to the Side Menu, but I've found that it's often difficult to "hit" the fly out which shows the sub-categories as there's only a small overlap in the bottom right hand corner of the main category's box.
What I'd like to do is to move the position of the fly out up so that its top is level with the top of the category box in the side menu.
Can someone tell me where and how to do this, please.
Offline
In the file {public}/media/skins/css/skins/css/all.css, edit the shared CSS file. Look in that file for:
/* +------------------------------------------------------------+ */ /* | Required Classes: Skin Widget - SIDEMENU | */ /* +------------------------------------------------------------+ */
And in that section, edit the margins of the second and third level li tags.
Offline
Thanks for your reply, but I'm not sure what you're referring to.
I thought it was this section:
.skin_widgetclass_SIDEMENU .skin_widgetmenu li ul { padding: 0px; background-color: #FFFFFF; position: absolute; width: 200px; left: -999em; z-index: 8000; margin: -16px 0px 0px 184px; }
But despite what I do, it seems to have no effect, so I'm obviously changing the wrong things. Please can you tell me which lines I should be changing.
Offline
This is the one:
margin: -16px 0px 0px 184px;
The -16 px is pushing the margin for the UL up 16 px, and the 184px is pushing the UL right 184px. Reload your browser after uploading the file to see changes.
Offline
I have tried that, but, no matter what I do, even changing them to ridiculous values (eg 160px 50px 50px 384px) and flushing the cache or trying a different browser, nothing happens.
I'm doing this in /web/ccp8/media/skins/css directory, which isn't quite the same as {public}/media/skins/css/skins/css/all.css which you give, but I can't see any other directories that match the one you give.
Offline
Assuming '/web/ccp8' is your home directory (where your index.php and admin.php reside), then you're making the edits in the right place. Can you give me a URL where you're making these changes?
Offline
Here's where I'm doing the development on the new site: http://www.affordable-leather.co.uk/ccp8/index.php
I've currently got it set with the "silly" values I mentioned above just to try to get something to happen, but to no avail.
BTW I've seen elsewhere on these forums some instructions for modifying my Europacart 7 Skin to be used with version 8. If I do that, would I still be able to use the fly-out menus etc?
Offline
Thanks. Edit this code in your skin's overrides.css file:
.skin_widgetclass_SIDEMENU .skin_widgetmenu li ul { box-shadow: 2px 2px 2px #555555; margin: -13px 0 0 180px; width: 195px; }
That's the last spot in the chain where the margin is defined.
Offline
Thank you for this.
For anyone else's interest, I changed the margin values to:
margin: -26px 0 0 180px;
This puts the top of the flyout level with the top of the categories item it derives from.
Offline
It seems to be working ok in both IE and Chrome
See http://www.affordable-leather.co.uk/ccp8/index.php
Offline
Graham wrote:
Thank you for this.
For anyone else's interest, I changed the margin values to:Code:
margin: -26px 0 0 180px;This puts the top of the flyout level with the top of the categories item it derives from.
I can't seem to get it to work either. My sidemenu related categories and pages don't slide out right. They pop under the related item and are not popping out.
Last edited by mdowning (04-23-2014 23:33:27)
Offline
In the management interface, under System | Displays | Skin Widgets, edit the category skin widget and set it's Desktop class to 'skin_widgetclass_SIDEMENU'. I think you still have it as 'skin_widgetclass_NAVMENU'.
Offline
webmaster wrote:
In the management interface, under System | Displays | Skin Widgets, edit the category skin widget and set it's Desktop class to 'skin_widgetclass_SIDEMENU'. I think you still have it as 'skin_widgetclass_NAVMENU'.
I do not have a category skin widget showing in the skin widgets listings. This is what's showing in that listing
Update Store Product Menu True (1) SIDEMENU 10 True (1) MOBILENAVMENU 30
Update Store Quick Store Search True (1) SIDEMENURIGHT 10 True (1) MOBILENAVMENU 10
Update System Cookie Information True (1) SIDEMENU 10 True (1) MOBILENAVMENU 10
Update Store Cart False (0) NAVMENU 20 True (1) MOBILENAVMENU 60
Update System Currencies True (1) SIDEMENURIGHT 20 True (1) MOBILENAVMENU 70
Update Website Main Menu True (1) SIDEMENU 20 True (1) MOBILENAVMENU 10
Update System Mobile / Full Site True (1) FOOTER 20 True (1) MOBILEFOOTER 30
Update Store Location True (1) NAVMENU 20 True (1) MOBILENAVMENU 80
Update System Follow Us False (0) FOOTER 30 False (0) MOBILEFOOTER 30
Update Store Store Menu True (1) SIDEMENURIGHT 30 True (1) MOBILENAVMENU 40
Update Store Product Filter True (1) SIDEMENU 30 False (0) MOBILEFOOTER 90
Update System Account Menu True (1) SIDEMENURIGHT 30 True (1) SIDEMENU 10
Update Website News and Updates True (1) SIDEMENURIGHT 40 True (1) SIDEMENU 90
Update Website Banner Advertisements False (0) SIDEMENU 90 False (0) MOBILEFOOTER 90
Offline
did you change the widget title to Product menu?
Offline
Yes, but that does not explain why I'm having this problem. It's also affecting the related web pages.
Offline
webmaster wrote:
You've got your CSS class wrong. Change it as per post 13.
It IS set as:
Desktop Display Group = SIDMENU
Desktop Display Class = skin_widgetclass_SIDEMENU
That's not what's causing it because that should not affect the related pages menu. Both are not flying out, instead they are showing up under the related category or page in the menu.
It does it in both IE and Firefox also. I did change the name from Categories to Products Menu but that's just a cosmetic change.
Offline
I know it's probably just be a typing error in your post but check your spelling in the Skinwidgets - desktop display group. In your last post you stated SIDMENU as opposed to SIDEMENU.
Offline
nigel wrote:
I know it's probably just be a typing error in your post but check your spelling in the Skinwidgets - desktop display group. In your last post you stated SIDMENU as opposed to SIDEMENU.
Typo
Offline
webmaster wrote:
You've got your CSS class wrong. Change it as per post 13.
Nick, I copied and pasted what the skin widget class look like for this section.....
Update Component Name | Desktop Display Status | Desktop Display Group | Desktop Display Order | Mobile Display Status | Mobile Display Group | Mobile Display Order Update Store Quick Store Search True (1) SIDEMENURIGHT 10 True (1) MOBILENAVMENU 10 Update Store Product Menu True (1) SIDEMENU 10 True (1) MOBILENAVMENU 30 Update Store Cart False (0) NAVMENU 20 True (1) MOBILENAVMENU 60
Offline
mdowning wrote:
webmaster wrote:
You've got your CSS class wrong. Change it as per post 13.
Nick, I copied and pasted what the skin widget class look like for this section.....
Code:
Update Component Name | Desktop Display Status | Desktop Display Group | Desktop Display Order | Mobile Display Status | Mobile Display Group | Mobile Display Order Update Store Quick Store Search True (1) SIDEMENURIGHT 10 True (1) MOBILENAVMENU 10 Update Store Product Menu True (1) SIDEMENU 10 True (1) MOBILENAVMENU 30 Update Store Cart False (0) NAVMENU 20 True (1) MOBILENAVMENU 60
What happens is that the fly outs are offset inside and under the related sub category or page associated with said category or main page link
Offline
Like this Nick
Last edited by mdowning (07-02-2014 10:21:36)
Offline
Pages: 1 2