Support » Themes and Templates » How to make a WordPress theme consistent on all browsers?

  • Hi everybody, first time poster.

    I’m trying to work out how to make my website appear consistently on all browsers. On IE9 and Google Chrome, some div tags appear out of sync of the main content. For instance, I’m using a plugin navigation bar called PBK Mega Menu, and a custom sidebar. The theme I’m working on is the Twenty Twelve 1.0 one. The custom sidebar doesn’t move with the rest of the content whenever I minimize any browser I use, while my navigation bar moves out of sync, with drop-down menus appearing out of the bar. I tried to edit the sidebar.php file and the CSS for the navigation bar, but I’m unable to fix these problems.

    Underneath is the CSS for the widget-area I used for the current sidebar position.

    .widget-area {
    	margin: 4.1429rem 0 0;
    	 margin-left: -300px;

    And this is where I’ve put the code for the plugin navigation bar (called PBK Mega Menu) in “header.php”:

    ` <body <?php body_class(); ?>>
    <strong><?php pbk_mega_menu(); ?> <!– PLUGIN NAVIGATION BAR IS HERE –></strong>
    <div id=”page” class=”hfeed site”>
    <header id=”masthead” class=”site-header” role=”banner”>
    <hgroup> `

    If there’s any information I need to tell anybody to help me out, feel free to give me a shout. Thanks.

Viewing 10 replies - 1 through 10 (of 10 total)
  • There’s no way to help with CSS without seeing the site live.

    And are you using a child theme? You should not be modifying any theme files – your changes will be lost when WP is updated.

    Unfortunately, I have not been using a child theme. Do you recommend that I should start again from scratch?

    By the way, if you do need to see the site, it’s here

    You don’t need to start from scratch entirely, but yes, you really should move your changes to a child theme. Aside from losing them upon updating, it’s also crucial to have an unmodified copy of the default theme for troubleshooting.

    Do you know which files you’ve changed? For any .php files (except functions), you can move those files to the child theme and replace with an original in the parent. For style.css, you can use a file diff-checker to find your changes and put only those in the child theme style.css. For functions.php, it’s more complicated – have you changed that one?

    I haven’t touched functions.php at all. The only php files I modified were header, sidebar, index and footer.

    Great – so that’s fairly straightforward:

    Make a copy of your theme folder on your local computer (easiest to use FTP or other file manager to do that)

    Make a child theme

    For the style.css file, find the changes you’ve made to the parent theme style.css file and put only those changes in the child theme. (You may need to “fix” some of those changes, depending on how they are coded.)

    Move a copy of those three .php files into the child theme.

    Download a new copy of twentytwelve to your local computer.

    Replace the files you changed in twentytwelve to get clean copies of those files in the parent.

    Switch to the child theme – you’ll need to redo some of the settings and options.

    It would be a good idea to make a complete back-up of your site before doing this :).

    Thanks for that, I’ll give it a go and come back to update how I went later. 🙂

    So far, I’ve got these two errors:

    Warning: require_once(/home/arar8482/public_html/gwps/wp-content/themes/twentytwelve-child/my_included_file.php) [function.require-once]: failed to open stream: No such file or directory in /home/arar8482/public_html/gwps/wp-content/themes/twentytwelve-child/functions.php on line 52

    Fatal error: require_once() [function.require]: Failed opening required ‘/home/arar8482/public_html/gwps/wp-content/themes/twentytwelve-child/my_included_file.php’ (include_path=’.:/usr/lib/php:/usr/local/lib/php’) in /home/arar8482/public_html/gwps/wp-content/themes/twentytwelve-child/functions.php on line 52

    Looks like you put the functions.php file in the child theme? Take that one out! If you didn’t change the functions.php file, no need to put any functions file in the child theme.

    Well, I have activated the child theme now, but now I’ve been trying to position the sidebar without success. I’ve tried using the position static, relative and fixed commands but without success.

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘How to make a WordPress theme consistent on all browsers?’ is closed to new replies.