Community Forums › Forums › Archived Forums › General Discussion › News Pro Theme Header Image Modification
Tagged: logo resizing, News Theme
- This topic has 3 replies, 3 voices, and was last updated 8 years, 8 months ago by jmack.
-
AuthorPosts
-
April 30, 2015 at 9:09 pm #149686m31Member
This is a 2 part question.
Want to modify the dimension allowable for News Pro Header image (a logo) from 90 x 260 to 90 x 420.
2nd, want the PNG image of that logo to actually look sharp (similar to a font). Experimented with this using the original 90 x 260 dimension. Tried increasing file resolution of PNG file to 1200 ppi, no luck. The cropping process just seems to return it to blurry jaggedville.
Then tried the SVG file route, but get an error when going through the cropping process.
Have been searching and experimenting with various articles about altering the functions.php and style.css files of the child theme, with some success on the resolution front, but with the logo disappearing when enlarging screen size.
These seem to be very pervasive issues, especially in regard to header image resolution, but ones with no pervasive answers.
Any ideas?
May 2, 2015 at 9:02 am #149817Davinder Singh KainthMemberTo change logo size:
1. Open functions.php file and change logo dimensions in the following code
//* Add support for custom header add_theme_support( 'custom-header', array( 'header_image' => '', 'header-selector' => '.site-title a', 'header-text' => false, 'height' => 90, 'width' => 260, ) );
2. Open style.css and make corresponding adjustment to height value in the following code
/* Logo, hide text */ .header-image .site-title a { background-position: top !important; float: left; min-height: 90px; width: 100%; }
Sunshine PRO genesis theme
Need Genesis help? Davinder @ iGuiding Media | My Blog | Fresh Genesis ThemesMay 7, 2015 at 2:38 pm #150779m31MemberHello Davinder,
Thank you for your response.
Altering the style.css and functions.php code as you suggested works to properly place the new dimension of the image, and it also retains responsiveness. The second goal is to somehow have the image be of higher resolution.
No matter the resolution the image is uploaded as, the cropping process reduces it to a very non-retina sharpness of 90x420 at what I believe is 72ppi.
Is there way to place a PNG file with more information, therefore more edge sharpness, within the 90x420 boundary?
I experimented with simply quadrupling the image dimension allowance in the functions.php to 360x1680 which works to display a much sharper image, but of course interferes with browser properly responding to changes in window size, the header image will pop out of existence when expanded for example.
Any further insight would be greatly appreciated.
August 26, 2015 at 8:53 am #163570jmackMemberI had a similar request and made the adjustments to the function and css files which worked to some extent. But now the larger logo is appearing in full on the phone but is still in it's original size on the desktop and tablet views. I can't find obvious areas to adjust in the css to make it larger in those views. Any ideas or help with what to change in the css to make it appear larger across all views would be appreciated. Thanks.
-
AuthorPosts
- The forum ‘General Discussion’ is closed to new topics and replies.