Community Forums › Forums › Archived Forums › General Discussion › menus and alignment in Magazine Pro
Tagged: alignment, Magazine Pro, menu, problem
- This topic has 8 replies, 2 voices, and was last updated 8 years, 4 months ago by jimbo5.
-
AuthorPosts
-
July 7, 2016 at 6:39 am #189011jimbo5Participant
Hi,
I´ve been trying to change the padding and spaces beetwen menus in Magazine Pro Theme in this web: http://asacir.com/Used to be like this: http://prntscr.com/bpxc7m
And now, with the code is like this: http://prntscr.com/bpxclj
Te problem is that the logo and the search box are not aligned with the menu and posts.
I used this code in the custom css:
http://asacir.com//* Theme Name: Magazine Pro Theme custom css Theme URI: http://my.studiopress.com/themes/magazine/ Description: A mobile responsive and HTML5 theme built for the Genesis Framework. Author: StudioPress Author URI: http://www.studiopress.com/ Version: 3.1 Tags: black, white, one-column, responsive-layout, custom-background, custom-header, custom-menu, full-width-template, sticky-post, theme-options, threaded-comments, translation-ready, premise-landing-page Template: genesis Template Version: 2.1 License: GPL-2.0+ License URI: http://www.opensource.org/licenses/gpl-license.php */ @import url(https://fonts.googleapis.com/css?family=EB+Garamond); .site-header .wrap { border-bottom: 2px solid #fff; padding: 30px 0; } .nav-secondary .wrap { border-bottom: 1px solid #fff; } .magazine-home .content .widget-title, .sidebar .widget-title { border-radius: 3px; } .comment-form-url { display: none; } .responsive-menu-icon::before { content: "Acerca de"; display: inline-block; font: 20px/1 "dashicons"; margin: 0 auto; padding: 10px; } .nav-primary .responsive-menu-icon:before { content: "Acerca de" } .nav-secondary .responsive-menu-icon:before { content: "Menu"; } #menu-menu-principal { font-size: 11px; } #menu-menu-lateral-2 { font-size: 13px; } .site-header .wrap { border-bottom: 0px; padding: 0 0 2px 0; padding: 0 0 3rem 0; display: inline; } #nav-secondary { border-bottom: 0px; padding: 0 0 2px 0; padding: 0 0 3rem 0; }
July 7, 2016 at 10:49 am #189036Victor FontModeratorI'm not sure how you accomplished it, but the logo is positioned after the header right widget area instead of in the title area where it belongs. That's why the display is as it is. The logo should be added through the Appearance/Header menu or through Appearance/Customize/Header Image.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?July 7, 2016 at 12:45 pm #189046jimbo5ParticipantJuly 7, 2016 at 12:46 pm #189047jimbo5ParticipantSorry, this code
<a href="http://asacir.com"><img src="http://asacir.com/wp-content/uploads......jpg"></a>
July 7, 2016 at 3:10 pm #189051Victor FontModeratorThat's the wrong place to put it. The header hook will load the image just before the closing header tag after the rest of the header content. Insert the header image in the header area as I explained in my earlier post.
The image is a little large at 500px ?— 180px. You'll have to change the size in functions.php. Modify the following at line 42:
//* Add support for custom header add_theme_support( 'custom-header', array( 'header_image' => '', 'header-selector' => '.site-title a', 'header-text' => false, 'height' => 180, 'width' => 500, ) );
You may also have to adjust the CSS to accommodate the larger image.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?July 8, 2016 at 7:39 am #189097jimbo5ParticipantWell, I added the logo in Appearance/Customize/Header Image (380/90) and I´m still having the same problem with the alignment of the header, serach box, menus and posts.
July 8, 2016 at 7:47 am #189100jimbo5ParticipantUmmm, now is working, thank you 🙂
And one last cuestion, how can I put the menu and the logo closer?
July 8, 2016 at 8:54 am #189118Victor FontModeratorAround line 1277 in style.css look for:
.header-image .site-header .title-area, .header-image .site-header .widget-area { padding: 40px 0; }
Change the padding to suit your need. The 40px will affect both the top and bottom padding, if you want to change just the bottom and leave the top, you have to use padding: 40px 0 10px;
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?July 8, 2016 at 10:34 am #189125jimbo5ParticipantThank you, Victor.
I am very grateful for your help 🙂 🙂
-
AuthorPosts
- The forum ‘General Discussion’ is closed to new topics and replies.