Updated from 2.1.5 to 3.1.5 and… oh dear…
-
Topic
-
Hey Jason,
My client finally decided he was ready to update his site which is uses Themeforest Alyeska framework with a heavily customized child theme. So, today, the production site looks like this:
http://inexsystemsdesigns.com/site/Now, after the update on the dev site, I’m afraid the new code is giving my child theme the proverbial finger which is located here: 🙁
http://dev.inexsystemsdesigns.com/site/So, I downloaded the update from Themeforest, uploaded the update to the Alyeska directory and then copied over the functions.php file into the child theme.
Have i forgotten something? “Help me Obiwon, help me!” (Just a bit of Star Wars humour, there… ) 🙂
PS – If you need admin or FTP credentials, email me privately at kelley AT rwpstudios DOT com. Thanks so much, Jason! 🙂
-
Replies
-
In your child theme, have you been editing main, top-level theme files like header.php and footer.php? Start with removing header.php and footer.php from your child theme. And if you need to add anything to to be outputted in your header or footer, I’d suggest doing it through action hooks. This initial shock of what you’re seeing is why the warnings are at top of the main top-level template files, suggesting for you not to edit them.
Ok, so that worked. I removed the “header.php” file and suddenly my child theme worked (mostly). However, I have NO idea what action hooks are or how to use them. I know you have a TON of videos; do you have one specific to action hooks that you can point me towards?
PS – I didn’t get any warning files. I just created a “header.php” in the child theme and used it there to make “things happen”. I didn’t edit any root specific theme files.
If you’re coding child themes for clients, and you don’t know what an action hook is, it’ time to learn 😉
http://dev.themeblvd.com/tutorial/actions/
http://dev.themeblvd.com/tutorial/primary-framework-action-hooks/
Let’s start with this: Why were you editing header.php in the first place? What were you accomplishing by doing this? What were you trying to output in the header?
Honestly, I don’t know that I was. I think WAY back someone/you possibly someone told me to copy the header.php file into the child theme. The reason I think this is because I don’t see anything customized by me in the file I backed up:
<?php /** * The Header for our theme. * * WARNING: This template file is a core part of the * Theme Blvd WordPress Framework. This framework is * designed around this file NEVER being altered. It * is advised that any edits to the way this file * displays its content be done with via hooks and filters. * * @author Jason Bobich * @copyright Copyright (c) Jason Bobich * @link http://jasonbobich.com * @link http://themeblvd.com * @package Theme Blvd WordPress Framework */ ?> <!DOCTYPE html> <html <?php language_attributes(); ?>> <head> <?php themeblvd_head(); ?> <link href="https://plus.google.com/110733738855543116057" rel="publisher" /> </head> <body <?php body_class(); ?>> <?php themeblvd_before(); ?> <div id="wrapper"> <div id="container"> <?php themeblvd_header_before(); ?> <!-- HEADER (start) --> <div id="top"> <header id="branding" role="banner"> <div class="content"> <?php /** * Display header elements. */ themeblvd_header_top(); themeblvd_header_above(); themeblvd_header_content(); themeblvd_header_menu(); ?> </div><!-- .content (end) --> </header><!-- #branding (end) --> </div><!-- #top (end) --> <!-- HEADER (end) --> <?php themeblvd_header_after(); ?>
That said, there is a big visual difference between the production site (inexsytemsdesigns.com) and the dev (dev.inexsystemsdesigns.com/site). So, I’m lost big time… and yes, it is high time that I start learning hooks/actions…
haha, yeah the big warning at the top of what you just pasted is what I was referring to.
So, the only reason I see there for you to copy over the header.php file in the first place looks like to output this in your
<head>?<link href="https://plus.google.com/110733738855543116057" rel="publisher" />
WordPress has an action hook that is required by ever theme called “wp_head”. So, if you ever wanted to output anything in the
<head>of your website, you’d just hook to that from your child theme’s functions.php.function my_google_plus() { echo '<link href="https://plus.google.com/110733738855543116057" rel="publisher" />'; } add_action('wp_head', 'my_google_plus');It looks like most everything else that is off is just from CSS in your child theme not meshing exactly right with updated stuff. So, you just need to go through and tweak the CSS to match the updated theme.
For example, your grey header background is applied with a selector like this:
#branding #header_content .container { ... }By looking at the updated markup, I can see that you’d want to target it like this instead:
#branding #header_content .header_content-inner { ... }Oh boy, this is going to be sooooo fun… 🙂 Thank you, as always, Jason…. You rock!!!
Merry Christmas!!!!!
Jason, I’ve run into another snag… the responsive piece is all jacked up. Because I don’t want to modify the source files of Alyeska, I’ve copied over the responsive.min.css and the responsive.css to my child theme into the “assets/css” directory. However, my changes aren’t being reflected and I suppose that’s due to that the theme doesn’t know to pick it up from the child directory. Is that right? If I am, where do I place that call?
The mobile version of your site looks fine to me? It actually looks much better than your live site, from what I can see.
WordPress does not work by copying random CSS files to your child theme. This is not how to override a stylesheet. You’d have to enqueue your version of the file over the theme’s…
But I would strongly suggest not doing this. Doing this really just doesn’t make sense. Your custom.css file is outputted after all of the theme’s CSS files, and so all of your CSS edits should be in that CSS file of your child theme.
If something you’re doing in your stylesheet messes with responsiveness of your site, then you need to account for that in your CSS, as you are developing a responsive website. Here are some examples of using the same @media queries used in the theme to target specific viewports.
/* Applied everywhere, at all viewports */ .whatever { ... } .whatever-else { ... } /* Tablets and below */ @media (max-width: 979px) { .whatever { ... } .whatever-else { ... } } /* Mobile */ @media (max-width: 767px) { .whatever { ... } .whatever-else { ... } } /* Everything ABOVE mobile */ @media (min-width: 768px) { .whatever { ... } .whatever-else { ... } } /* Everything ABOVE Tablet */ @media (min-width: 980px) { .whatever { ... } .whatever-else { ... } }Hey Jason,
Thanks for all the help above. It worked as usual! 🙂 Just one last thing… I’ve made all the changes in dev and got them client approved. Now, I’ve moved all the files and the database but for some reason that theme isn’t being displayed on the live site… it is just fine on the dev… but it’s just images and copy… no structure. Any idea what bone head maneuver I made??? 🙂 The URLS are as follows:
Dev Site: http://dev.inexsystemsdesigns.com/site
Live Site: http://inexsystemsdesigns.com/siteVERY APPRECIATIVE!
– Kelley : )
I’d double check the child theme you have uploaded and activated on the live site. Your live site is demonstrating the identical issue you originally posted about, suggesting to me that it’s still your original child theme, and not the new one you’ve been working on at the dev site.
- The forum ‘Alyeska Responsive WordPress Theme’ is closed to new topics and replies.