Home › Forums › Legacy Support › Support queries › Styling issues › Change header style
- This topic has 15 replies, 3 voices, and was last updated 7 years, 10 months ago by Skywalker [ ex VibeThemes].
-
AuthorPosts
-
February 17, 2017 at 11:07 am #96037morningkissSpectatorHi There, I would like to have a mix between the sleek header and the mooc app header... I'm actually using the sleek header : http://img11.hostingpics.net/pics/610288sleekheader.jpg. When I'm using the mooc app header it looks like that : http://img11.hostingpics.net/pics/848162moocheader.jpg. I tried to change the header.php and the default_login.php but the result is not like I want. I would like the login (mooc app style) on the right hand corner of the header, the logo on the left hand corner of the header, the navmenu on the center of the header and the main container (header) has full width... Here a photoshop picture which explain what I would like : http://img11.hostingpics.net/pics/789181mixheader.jpg. Can you please help me ? Thank you in advance.February 18, 2017 at 10:24 am #96223H.K. LatiyanParticipantWe are already planning to change the mooc header style like the screenshot you shared. So it will be added in the next update.February 20, 2017 at 9:24 am #96428morningkissSpectatorHi There, Thank you for your reply. Do you know when this update will be made ?February 20, 2017 at 11:06 am #96443H.K. LatiyanParticipantThe update will be released this week.February 20, 2017 at 12:11 pm #96472morningkissSpectatorOh really cool ! Thank you guy =)February 20, 2017 at 1:39 pm #96520H.K. LatiyanParticipantokFebruary 24, 2017 at 9:44 am #97221morningkissSpectatorHi, I just installed the 2.6 version. The mooc header is the same than before... Are you sure the update header are like that : http://img11.hostingpics.net/pics/789181mixheader.jpg Thank you in advance.February 24, 2017 at 2:49 pm #97290Skywalker [ ex VibeThemes]ParticipantKindly provide me your site url. Also Provide me a screenshot of how you want your header to be shown. Mooc header can be customised like that with simple css changes.February 24, 2017 at 3:39 pm #97325morningkissSpectatorHi Skywalker, Thank you for your reply. My website is : http://attiranceatomique.com/ The screeshot of how I want my header is : http://img11.hostingpics.net/pics/789181mixheader.jpg In fact I would like to have the header with a width of 100% (and not just with the container width). I would like the Logo on the left hand corner of the header, the main menu on the center of the header, the profile on the right hand corner of the header. The big thing I would like is to have the same profile style (with the sidebar which appears) than the "App style" header... Do you know if it is possible to do that ? Thank you in advance.February 25, 2017 at 12:42 pm #97504Skywalker [ ex VibeThemes]Participant.mooc.fix .container {padding-right:0px !important;margin-left:0px !important; margin-right:0px !Important;width:100% !important;}February 25, 2017 at 12:42 pm #97505Skywalker [ ex VibeThemes]ParticipantGo to wp-admin->appearance->customiser->add custom CSS-> add these lines and save.February 27, 2017 at 10:14 am #97739morningkissSpectatorHi There, Thank you ow my header is with a 100% width of screen. there are others issues... 1 - The main menu (.menu-main-menu-container) is not at the center of the header. Here is the screenshot : https://image.noelshack.com/fichiers/2017/09/1488190094-center-menu-nav.png 2 - I would like to delete the icons (cart and search). Here is the screenshot : https://image.noelshack.com/fichiers/2017/09/1488190089-delete-header-icon.jpg 3 - I would like a 100% width submenu. Here is the screenshot : https://image.noelshack.com/fichiers/2017/09/1488190089-megamenu-full.jpg 4 - I have display issue on Ipad mode and mobile mode. Here is the screenshot : https://image.noelshack.com/fichiers/2017/09/1488190084-photo-profile-size-mobile.jpg 5 - I would like to keep the Mooc header style but integrate the app style profile sidebar. Here is the screenshot : https://image.noelshack.com/fichiers/2017/09/1488190089-profile-app-style.jpg 6 - The profile photo and the username overlap. Here is the screenshot : https://image.noelshack.com/fichiers/2017/09/1488190089-space-photo-surname.jpg Thank you in advance...February 27, 2017 at 12:06 pm #97773Skywalker [ ex VibeThemes]Participant5th is not available. Go to wp-admin->appearance->customiser->add custom CSS-> add these lines and save. ul.topmenu li:nth-child(1){display:none !Important;} ul.topmenu li:nth-child(2){display:none !Important;} header.mooc{width:100% !important;} div#mooc_menu {width:55%; !important;} .sub-menu{ width: 100vw !important; left: calc(0px - 266px); } a.smallimg.vbplogin span{margin-left:20px !important;}February 27, 2017 at 1:26 pm #97821morningkissSpectatorThank You Skywalker ! Ok for the 5th I will let my header like that. For others readers it is width: "100%" and not "100vw". Perfect it is almost perfect but there are 2 issues on mobile view :/ 1 - https://image.noelshack.com/fichiers/2017/09/1488201785-mobile-screen.jpg 2 - https://image.noelshack.com/fichiers/2017/09/1488201785-mobile-screen2.jpg Do you know how to fix it ? Thank you so much =)February 28, 2017 at 1:30 pm #98061Skywalker [ ex VibeThemes]Participant2. a.smallimg.vbplogin img{margin-top:0px !important;max-width: 20px !important;}
-
AuthorPosts
- The topic ‘Change header style’ is closed to new replies.