Wordpress Themes - WP Forum at BFA
Click Here To DONATE! Support the theme development, get more attention and additional benefits based on your donation level. Your forum name will be highlighted.

Wordpress Themes - WP Forum at BFA » Forum Usage » Forum How-To »

Site Styles Distorting on Loading or Refresh


Build custom WP THEMES, without
coding.
Click here for THEMEFRAME

From the author of Atahualpa, the #1 most
downloaded (700,000+) theme @ wordpress.org
  #1  
Old Nov 17, 2012, 10:52 AM
New WordPress Fan
 
130 posts · Jul 2010
I have two sites running on Wordpress 3.1.4 with Atahualpa 3.6.4. Within the last few months, both of these sites have developed a problem with distortion of the site styles on loading and on each page refresh, in all browsers.

Sometimes (rarely) the pages render properly, sometimes distorted to different degrees on each page refresh (e.g. sometimes improperly wrapping the navigation bar, not rendering the proper font size and color for the site title or tagline or for the RSS link in the header, and various combinations of the following and other errors: not showing the proper font size and color for page titles and other headers; omitting the narrow border between the left sidebar and center column, or rendering it duplicated three or four times; omitting the bottom border that is supposed to appear under each widget; omitting all the borders that are to surround a particular footer widget area; omitting padding and margins; and sometimes completely distorting the whole page, or showing only source code upon some page refreshes!).

These problems occur in all current-version browsers that I have tried -- Firefox, IE, and Chrome. (I do note that some CSS distortion has been noted with newer versions of Firefox: E.g. http://stackoverflow.com/questions/1...bug-issue?rq=1 or See: https://support.mozilla.org/en-US/questions/937846 ).

My two sites that are having these problem were built in 2011, and were working fine until sometime within the past few months, when these problems developed. I have not made any changes to the sites since December, 2011. My web host, GoDaddy, says that they have not re-configured their servers in any way.

None of my other sites, which are running older versions of WP and Atahualpa, are experiencing these problems.

Can anyone please HELP!!

Many thanks!!
  #2  
Old Nov 17, 2012, 01:32 PM
juggledad's Avatar
juggledad
 
21,705 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
1) why are so far back on both WP and Atahualpa releases?
2) saying you have a problem doesn't help with out seeing the site
__________________
If you like my help, please consider donating. I am happy to provide greater detail on this and other topics if you hire me. Please send detailed support requests to me as a private message, thank you.
Juggledad | Forum Moderator/Support
  #3  
Old Nov 18, 2012, 12:20 AM
New WordPress Fan
 
130 posts · Jul 2010
Juggledad,

I sent you a private message with the URLs for the two sites.

Many thanks!
  #4  
Old Nov 18, 2012, 01:37 PM
juggledad's Avatar
juggledad
 
21,705 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
I would check your error ogs and access logs. I viewing the page I see the 'distortion' and upon viewing the source, I have an idea of what is happening.

In 3.6.4 the theme is using the php 'inlclude' command (later versions stopped using this). In your case, when the distortion happens after the second include, every include copies in the same data.

If the site has had no changes and has been running fine, tat leads me to beleive that some setting on the server has been changed and that is causing the issue. I flat out don't beleive that GoDaddy hasn't made a single change in the server - ie no maintnance, no security patches , nothing...I don't think so.

All that said, you are on old releases of both WordPress and Atahualpa and I would first suggest upgrading WP and then Atahualpa and seeing if the issue remains.
__________________
If you like my help, please consider donating. I am happy to provide greater detail on this and other topics if you hire me. Please send detailed support requests to me as a private message, thank you.
Juggledad | Forum Moderator/Support
  #5  
Old Nov 19, 2012, 11:18 AM
New WordPress Fan
 
130 posts · Jul 2010
I have successfully updated to WordPress 3.3.2 (the latest version that GoDaddy had available), but the problems of distortion on loading and refresh persist.

The reason I used Atahualpa 3.6.4 on these sites is that, at the time, it was the last version of Atahualpa that included the feature allowing you to Add New Widget Areas via the Atahualpa Theme Options.

Question: Has this feature (Add New Widget Areas) been added back in ATO in Atahualpa 3.7.9?

If I now update to Atahualpa 3.7.9, will the new widget areas that I created via ATO in Atahualpa 3.6.4 remain, or will they be lost? Via ATO in Atahualpa 3.6.4, I had created four new Footer widget areas, and three new Center Column Widget Areas - one Above Loop, one Loop, and one Below Loop. Upon upgrade to 3.7.9, will these new widget areas automatically remain, or would I have to recreate them by hard coding in the main index file, or somewhere else?

Many thanks!
  #6  
Old Nov 19, 2012, 02:56 PM
New WordPress Fan
 
130 posts · Jul 2010
Further to above: I tested Atahualpa 3.7.9 on a demo site, and see that the ATO Options in 3.7.9 do include an option to Add New Widget Areas -- similar to that option which was included in 3.6.4.

When I upgrade from 3.6.4 to 3.7.9, will the update automatically carry the New Widget Areas I created in 3.6.4 into 3.7.9?

Or, if I export the Atahualpa settings file from 3.6.4 before upgrading, and then import that settings file into 3.7.9, will the settings file carry with it all the New Widget Areas I created in 3.6.4?

Many thanks!

Last edited by New WordPress Fan; Nov 19, 2012 at 02:58 PM.
  #7  
Old Nov 19, 2012, 04:43 PM
juggledad's Avatar
juggledad
 
21,705 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
Wordpress is now at release 3.4.2 and you should be able to do the upgrade from within wordpress itself. If you can't it could mean that GoDaddy is blocking it - in which case I would get a new host.

You should always do a backup of thedatabase and your wp-config.php and wp-contents folder before doing an upgrade. You can also do a manual install of the theme - there are instructions in the Atahualpa FAQ forum.

Depending on where your new widget area is defined, it should still be there when you upgrade.
__________________
If you like my help, please consider donating. I am happy to provide greater detail on this and other topics if you hire me. Please send detailed support requests to me as a private message, thank you.
Juggledad | Forum Moderator/Support
  #8  
Old Nov 22, 2012, 09:56 PM
New WordPress Fan
 
130 posts · Jul 2010
Thank you, Juggledad! Your suggestions worked perfectly, and solved the problem!

Upgrading to Wordpress 3.4.2 and Atahualpa 3.7.9 did completely solve the distortion problems on uploading and page refresh. Also, all the widget areas did transfer upon upgrade -- I just had to add manual coding to the index.php file in Atahualpa 3.7.9 for the Center Column Widget Areas (per instructions you had given in a previous forum post). That worked perfectly.

So far I have completed one of the two sites, and hope this will solve the problems on the other site too (that other one has BuddyPress on it -- so hope that does not complicate anything...)

The only issue remaining on the site that I have upgraded is: After the upgrade, the CSS identifiers previously used to style four specific widgets in the footer_4col_widget_area, no longer seem to affect those widgets. The four widgets in question are identified as follows (based on the page source):

Code:
div#listcategorypostswidget-5

div#listcategorypostswidget-6

div#listcategorypostswidget-7

div#listcategorypostswidget-8
Any ideas on how I can now style these widgets? I want to make the font smaller, and reduce the left margins or left padding for each one.

Again, thanks so much for all your help!!

Last edited by New WordPress Fan; Nov 22, 2012 at 10:01 PM.
  #9  
Old Nov 23, 2012, 01:55 AM
juggledad's Avatar
juggledad
 
21,705 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
Look at the source of the generated page and look at the ID that is being used
__________________
If you like my help, please consider donating. I am happy to provide greater detail on this and other topics if you hire me. Please send detailed support requests to me as a private message, thank you.
Juggledad | Forum Moderator/Support
  #10  
Old Nov 23, 2012, 09:17 AM
New WordPress Fan
 
130 posts · Jul 2010
Yes, I did that, Juggledad. The source code identifiers being generated for the footer widgets in question are quoted in my post above. But, they don't seem to affect the widgets, after the upgrade of WP and Atahualpa.

I will remind you of the URL by private message.

Many thanks.
  #11  
Old Nov 23, 2012, 02:29 PM
juggledad's Avatar
juggledad
 
21,705 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
you have additional backslashes
HTML Code:
<div id=\"listcategorypostswidget-8\" class=\"footer-widget widget_listcategorypostswidget\">
search the forum, this has been seen before but I don't remember what the issue was. I vaguely think it was a server setting
__________________
If you like my help, please consider donating. I am happy to provide greater detail on this and other topics if you hire me. Please send detailed support requests to me as a private message, thank you.
Juggledad | Forum Moderator/Support
  #12  
Old Nov 23, 2012, 03:39 PM
New WordPress Fan
 
130 posts · Jul 2010
Have searched the forum, and find these threads:

http://forum.bytesforall.com/showthr...ht=backslashes

http://forum.bytesforall.com/showthr...ht=backslashes

http://forum.bytesforall.com/showthr...ht=backslashes

http://forum.bytesforall.com/showthr...ht=backslashes

But none of these seem to offer a solution to the blackslash problem I am experiencing. I checked and the php.ini does not include anything about "magic_quotes_gpc = on"

The problem of added backslashes seems to be occurring only in the 4-column Footer widget area that I had previously added to the site. The php code I used to define the footer widget area is:

Code:
<?php bfa_widget_area('name=Footer 4Col Widget Area&cells=4&align=9&align_2=9&align_3=9&align_4=9&width_1=220&width_2=250&width_3=250&width_4=210&before_widget=<div id="%1$s" class="footer-widget %2$s">&after_widget=</div>'); ?>
This seemed to work fine in Wordpress 3.1.4 and Atahualpa 3.6.4. I was able to style a specific widget in this footer widget area, with the following CSS Code:

Code:
div#listcategorypostswidget-5 {
    padding-right: 0px;
    padding-left: 0px;   
}

div#listcategorypostswidget-5 ul {
margin-left: 0px;
padding-left: 0px;
padding-right: 5px;
font: 9pt Times New Roman;
font-weight: normal;
text-align: left;
}
The problem of the added backslashes for all widgets in the 4-column footer widget area (which prevents styling with CSS) only developed after upgrading the site to Wordpress 3.4.2 and Atahualpa 3.7.9.

BTW - I tried adding the backslashes into the identifiers for purposes of the CSS code, and that did not work.

I'll greatly appreciate your help with this!!
  #13  
Old Nov 23, 2012, 03:46 PM
juggledad's Avatar
juggledad
 
21,705 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
here is something you could try.
1) do a database backup
2) Remove the widgets from the widget areas
3) remove the new widget area code from the footer
4) view the front page
5) go to ato->New widget area - delete the widget areas
6) view the front page

now add them back in again
__________________
If you like my help, please consider donating. I am happy to provide greater detail on this and other topics if you hire me. Please send detailed support requests to me as a private message, thank you.
Juggledad | Forum Moderator/Support
  #14  
Old Nov 23, 2012, 03:54 PM
New WordPress Fan
 
130 posts · Jul 2010
O.K. I will try that, Juggledad.

Meanwhile, I noticed the following message on scroll-over of the source code containing the backslashes:

"Quote in an unquoted attribute value. Probable causes: Attributes running together or a URL query string in an unquoted attribute value."

Does this tell you anything?

Many thanks!
  #15  
Old Nov 24, 2012, 10:33 AM
New WordPress Fan
 
130 posts · Jul 2010
Hi Juggledad,

Thanks for all your help! I tried your suggestion (the 6 steps you listed) on a demo site (virtually identical to the site at the URL I sent you - and also running WP 3.4.2 and Atahualpa 3.7.9). Same result. The backslashes are still being added around the identifiers for the widgets only in the Footer Widget area that I had added to the site.

And, as before, the following error code appears on a mouse-over of the page source code containing the extra backslashes:

Quote:
Quote in an unquoted attribute value. Probable causes: Attributes running together or a URL query string in an unquoted attribute value.
I also tried deleting the Footer Widget area, and adding it back by putting the footer php code in the footer.php file, rather than in the text area for Footer in ATO. When I did this, the entire footer did not display, and instead the following error message appeared where the footer should be:

Quote:
Parse error: syntax error, unexpected '}' in /home/content/25/3559525/html/wordpressDemo/wp-content/themes/atahualpa/footer.php on line 1
This error message appeared, regardless of where I placed the footer widget area code within the footer.php file.

Considering the two error messages quoted above - do you think there might be a coding error in the footer.php file for Atahualpa?? Is there an extra "}" somewhere in the code? Or a missing "{" before a "}"??

Or, is there an error in my php code adding the 4-column Footer Widget Area?

Code:
<?php bfa_widget_area('name=Footer 4Col Widget Area&cells=4&align=9&align_2=9&align_3=9&align_4=9&width_1=220&width_2=250&width_3=250&width_4=210&before_widget=<div id="%1$s" class="footer-widget %2$s">&after_widget=</div>'); ?>
Thanks again for all your help, Juggledad!! Much needed and appreciated!!
  #16  
Old Nov 24, 2012, 11:25 AM
juggledad's Avatar
juggledad
 
21,705 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
The new widget area code should go in the ata->Style & edit FOOTER->Footer: Content footer option not footer.php
__________________
If you like my help, please consider donating. I am happy to provide greater detail on this and other topics if you hire me. Please send detailed support requests to me as a private message, thank you.
Juggledad | Forum Moderator/Support
  #17  
Old Nov 24, 2012, 01:16 PM
New WordPress Fan
 
130 posts · Jul 2010
O.K. I solved the problem of the added backslashes in the source code for widgets added in the Footer 4 Column Widget area, by following the tip from tracytrends in this thread: http://forum.bytesforall.com/showthread.php?t=16304.

Specifically, I changed the php code to add the 4 column widget area back to the basic:

Code:
<?php bfa_widget_area('name=Footer 4Col Widget Area&cells=4&align=9'); ?>
This solved the issue of the added backslashes, and works for me now. But, this would not allow me to change the widths of the four widget areas.

There must be something in the code I had previously used to add the 4 column footer widget area with alignment specified (which is the code recommended for that purpose in ATO > Add New Widget Areas) that does not play with Atahualpa versions after 3.6.4. I had no problem using the same code with alignment specified to add the 4 column footer widget area in Atahualpa 3.6.4.

It would be great if this problem could be ironed out for future use, as people may want to alter the widths of the four columns in a 4 column footer widget area.

Many thanks!
  #18  
Old Nov 24, 2012, 01:41 PM
juggledad's Avatar
juggledad
 
21,705 posts · Mar 2009
OSX 10.8.5 WP 3.8.x Atahualpa 3.7.x Safari 6.x Firefox 25 XP
it has to be something about your server. Using the same new widget area code, I do not get the backslashes.
__________________
If you like my help, please consider donating. I am happy to provide greater detail on this and other topics if you hire me. Please send detailed support requests to me as a private message, thank you.
Juggledad | Forum Moderator/Support

Bookmarks

Tags
atahualpa 3.6.4, css distortion, site distorts on refresh, wordpress 3.1.4

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
Removing/Disabling specific scrip and styles from loading in header lakewooditsupport Header configuration & styling 0 Mar 22, 2012 01:17 PM
Site not loading, only background... hardy9298 Atahualpa 3 Wordpress theme 4 Jun 6, 2011 01:24 PM
background image distorting jimzook Atahualpa 3 Wordpress theme 3 Mar 27, 2011 12:04 PM
[SOLVED] Site Not Loading correctly petercliff1 Sidebars & Widgets 21 Jan 22, 2011 12:56 AM


All times are GMT -6. The time now is 03:38 AM.


Powered by vBulletin® Copyright ©2000 - 2014, Jelsoft Enterprises Ltd.