Community Forums › Forums › Archived Forums › Design Tips and Tricks › Altitude Pro – some questions about adding widget areas & adding site logo
Tagged: Altitude Pro, background image, Logo, widget area
- This topic has 23 replies, 4 voices, and was last updated 6 years, 10 months ago by jhguynn.
-
AuthorPosts
-
April 12, 2017 at 7:40 am #204669jhguynnMember
I'm developing a site locally, so I have no live links to share. I'm using Altitude Pro theme, and I'm reasonably proficient in using and modifying Genesis themes. Nonetheless, I have 2 questions about site modification:
(1) I added 2 extra widget areas to the frontpaae.php by editing functions.php. What file do I modify to add the extra background image I need for one of these newly added widget areas? I can't seem to locate that code.
(2) I want to add a logo image to the site header. none of my usual tricks seem to work here. I can't even find where in the functions.php the image area for logo is even defined. Appreciate some help here.
Regards, Jeff.
April 12, 2017 at 9:26 pm #204702Brad DaltonParticipant1. The lib > customize.php file.
2. Try the customizer > header image setting.
April 13, 2017 at 7:56 am #204729jhguynnMemberBrad: thanks for chiming in.
The customize --> header image edit did the trick. I'm so used to just coding it manually, I didn't notice that the theme had this built in.
However, I'm not seeing where in the customize.php file the background images are being added to the respective widget areas. Can you enlighten me a bit about this? The background images provided in the theme's image folder are bg-1.jpg, bg-2.jpg, bg-3.jpg, and bg-4.jpg. I want to be able to add bg-5.jpg to the extra widget area I added.
Thanks for any help you can provide.
April 13, 2017 at 3:58 pm #204750James ChaiMemberIf I am following along correctly ...
You can find the folder that contains bg-1.jpg, bg-2.jpg etc with FTP/cPanel access and navigate to wp-content/themes/altitude-pro/images/
All the example/temporary background images are stored there.
Since you are developing locally then you should be able to use
windows explorer => altitude-pro => images and see the images there.
Marketing, Sales and WordPress Growth Hacking http://www.smbpress.com
April 13, 2017 at 5:19 pm #204756jhguynnMemberJchai: I'm having no problem locating the folder where the background images are stored. My problem is I added an additional widget area to frontpage.php, and I want to define the background image for that new widget area. Brad suggested the correct file to modify would be customize.php. But I looked at that file, and I'm not seeing it.
April 13, 2017 at 6:59 pm #204760jhguynnMemberI figured out at least one thing I need to edit in the customize.php file. I needed to register the additional image required to serve as background image in the extra widget area (see '9'):
function altitude_customizer_register( $wp_customize ) { $images = apply_filters( 'altitude_images', array( '1', '3', '5', '7', '9' ) ); $wp_customize->add_section( 'altitude-settings', array( 'description' => __( 'Use the included default images or personalize your site by uploading your own images.<br /><br />The default images are <strong>1600 pixels wide and 1050 pixels tall</strong>.', 'altitude-pro' ), 'title' => __( 'Front Page Background Images', 'altitude-pro' ), 'priority' => 35, ) );
=======
When I visit the "customize" secion of "appearance" controls, the bg-9 image I added to the the folder shows up, but when I visit frontpage.php in my browser, it's not there. I refreshed my cache.
Anybody know what I should do next?
April 13, 2017 at 9:44 pm #204765Brad DaltonParticipantApril 14, 2017 at 5:47 am #204774jhguynnMemberThank you Brad for pointing me to your paid membership site. I'm sure it has great value.
Anybody else (who knows their way around Altitude Pro) want to help me out with this?
April 14, 2017 at 6:26 am #204782James ChaiMemberDid you add the corresponding markup to the front-page.php file?
i.e. (look for the following blocks and add)
if ( is_active_sidebar( 'front-page-1' ) || is_active_sidebar( 'front-page-2' ) || is_active_sidebar( 'front-page-3' ) || is_active_sidebar( 'front-page-4' ) || is_active_sidebar( 'front-page-5' ) || is_active_sidebar( 'front-page-6' ) || is_active_sidebar( 'front-page-7' ) || is_active_sidebar( 'front-page-9' ) )
also
genesis_widget_area( 'front-page-9', array( 'before' => '<div id="front-page-9" class="front-page-9"><div class="image-section"><div class="flexible-widgets widget-area' . altitude_widget_area_class( 'front-page-9' ) . '"><div class="wrap">', 'after' => '</div></div></div></div>', ) );
Marketing, Sales and WordPress Growth Hacking http://www.smbpress.com
April 14, 2017 at 8:46 am #204790jhguynnMemberJchai:
Thanks for your help, I'm getting closer. I had already added the genesis_widget_area code for front-page-8 (solid-section) and front-page-9 (image-section), but I had neglected to modify the conditionals (i.e. "...if ( is_active_sidebar( 'front-page-1' )...). I added this for widget areas front-page-8 and front-page-9.
But even after saving, clearing image cache, using ctrl + f5 to clear scripts, and refreshing the page...I get no change, i.e. the bg-9 background image I have in the images folder does not appear.
Anything else I might be missing? Happy to take the site live so I can share.
April 14, 2017 at 2:28 pm #204796James ChaiMemberPost a link and let's see what's under the hood.
Marketing, Sales and WordPress Growth Hacking http://www.smbpress.com
April 14, 2017 at 8:16 pm #204804jhguynnMemberJchai: here you go, have at it. FYI: the image bg-9 is blue. You'll know it when the image appears.
http://demo.repchampion.com/wp-admin/
Admin Username: StudioPress
Password: ^q!E9%nRLcbXrYF9Y64X18)qPound away on the code all you like. This is a demo site. Be sure to tell me how you do it so I can repeat the trick on my real site.
Thanks for your help!
April 17, 2017 at 4:53 am #204872jhguynnMemberBump. Jchai? I posted a link to my demo site with admin login credentials. See above. Thanks, Jeff.
April 17, 2017 at 10:44 am #204888James ChaiMember@jhguynn give me a couple of days to play around with it and I will get back to you.
Got (3) young boys that were OFF from school for spring break 🙂
Marketing, Sales and WordPress Growth Hacking http://www.smbpress.com
April 17, 2017 at 5:06 pm #204901Victor FontModeratorYou have to modify the JS file that adds the images to the inline styles. I'm on my iPad at the moment and don't remember the file name off hand. It's in the child theme js directory.
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?April 18, 2017 at 10:40 am #204952jhguynnMemberHello Victor: Thanks for pointing me to the javascript. If you could point me a little closer to the file and edits I need to make, I'd really appreciate it. Thanks!
May 5, 2017 at 8:26 am #205953jhguynnMemberVictor Font or JChai: thanks for the guidance so far. "You have to modify the JS file that adds the images to the inline styles". Could you specify which js file, and where is the code that I need to modify and how? I had a look around and was unsuccessful in identifying any code that adds the existing images to the inline styles, let alone being able to add my new images. Thanks.
May 15, 2017 at 6:20 am #206452jhguynnMemberBump. Trying to get the last piece of the puzzle: know which javascript file to modify and how. JChai? Victor Font? Anybody?
Thanks, Jeff.
May 15, 2017 at 7:09 am #206460Victor FontModeratorIn Altitude Pro, the images are handled by lib/output.php in lines 19 through 25.
$opts = apply_filters( 'altitude_images', array( '1', '3', '5', '7' ) ); $settings = array(); foreach( $opts as $opt ){ $settings[$opt]['image'] = preg_replace( '/^https?:/', '', get_option( $opt .'-altitude-image', sprintf( '%s/images/bg-%s.jpg', get_stylesheet_directory_uri(), $opt ) ) ); }
Regards,
Victor
https://victorfont.com/
Call us toll free: 844-VIC-FONT (842-3668)
Have you requested your free website audit yet?May 16, 2017 at 7:02 pm #206575jhguynnMemberBoom! That was the last piece of the puzzle. Success! Thanks Victor. 🙂
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.