I'm asking for help for those who have experience in changing an html file to a php file. I've tried everything I know (and I'm not the smartest I admit) but I don't understand why the following is happening.
Currently: When viewing on mobile, the mobile menu button has gone, the toggle switch which changed prices from monthly to annually, tabs which displayed different content has gone. As a result:
If there was a toggle, both the toggle results are displayed one above the other
If there was a tab, each tab element is displayed underneath the other
The mobile menu button has gone completely
Background:
I purchased an HTML template but it turns out the seller didn't want to help. I wanted to split and convert the page into a php page as I wanted a single header/footer file which I could import. As you will see (if you check the repo) the header.php and footer.php file is getting imported into the page php file.
I created the pages by first:
Renaming the original html file to a php file
Cut the header and footer and import them back into the page php file
That's all I have done. It seemed to work, however another check (after cache cleared) I noticed the issues.
The link to the site page im referring to is:
https://blueboxhosting.co.uk/products-cloud-hosting
But if you look at any of the pages, you'll see errors on all of them now where they're should have been controls (eg toggles, mobile menu, tabs etc)
I've created a snipped so you can view the code and HOPEFULLY spot where I've been a moron:
https://bitbucket.org/snippets/bbhostinguk/7e5qxp
Any help with this would be amazing as I just can't figure it out.
Start by running the HTML generated by PHP through a validator, e.g. https://validator.w3.org/
Your code has numerous stray tags which may or may not affect the rendering.
Another tip is to comment off everything and then uncomment section by section and check when things start to break.
Related
So i have Wp rocket on my site and i saw that every time i modify a image or a text from my site, the homepage appears white with only the cookie icon visible.... i have to delete cache each time this happens and also i have to check page every time.. This i what support said but no clue.....
I enabled WP Debug while performing the following test:
I made a small edit (added a dot at the beginning of the content) and saved the settings. I visited the page from desktop and from mobile, but it rendered correctly. I repeated the test by reverting the change I made. Still, the page got rendered correctly.
So far I could not reproduce the issue, but I checked the information provided by Sandy. Based on my observations, the issue is not related to WP Rocket, but I will explain to you why you see it when WP Rocket is enabled.
Generally, when a page is rendered in WordPress your theme is rendering the following parts of the code in the exact order for each page:
header.php
template (i.e. the content)
footer.php
When the issue occurs, the template part is missing. Here is how I found it:
Sandy was able to reproduce the issue in the past and shared the code difference between the blank page and the correctly displayed page. You can find it here: https://www.diffchecker.com/AKBv9sVj/
Here is the place where part of the HTML is missing on the "blank" page. And I highlighted the last line of code that is included in both cache files:
Full-screen image: https://i.imgur.com/28DgxpT.png
That last line of code comes from header-adora-framework.php which is included with no issues:
Similarly, the next segment that both pages have in common comes from the footer:
Full-screen image: https://i.imgur.com/wsw4wHk.png
This is where the code in footer-adora-framework.php, and it is also included with no issues:
Full-screen image: https://i.imgur.com/9Nw0QDv.png
Based on this, I can see that the template part is missing. It seems your theme is not rendering the template sometimes.
I checked the debug.log that is available on the server and found the following fatal error that might be related to the issue:
Here is the main part of the error: "The template "/wp-content/themes/project-theme/templates/layout.html.php" cannot be rendered."
If you check the file mentioned in the error, you will find that this is exactly the part that is missing:
Full-screen image: https://i.imgur.com/SpLKbyH.png
The code from /wp-content/themes/project-theme/templates/layout.html.php:
Full-screen image: https://i.imgur.com/7KfMxCR.png
The reason that you see the issue only when WP Rocket is enabled is due to caching. WP Rocket "takes a snapshot" of the page the way it was rendered the first time it was accessed.
If the template did not render the template part when the page was accessed - this is how the page will be cached and you will see the issue persists.
This, however, does not mean that the issue is resolved when you disable WP Rocket.
The issue is happening, but it is not persistent as with caching. Refreshing the page when caching is not present would likely resolve the problem.
You would need to pass this information on to your theme support. Possibly they will have suggestions on how the problem can be resolved.
I try all but nonthing. I hope to fix this with your help
You can see on this page: http://oaktreehealth.ca/community/
That the PHP is not rendering out for some reason. I have the same function enabled on most other pages where you see the image in the background at the top of the page.
I'm not sure why all of a sudden it stopped rendering on this page? It was working fine, maybe a wordpress update?. I'm using wooththemes Canvas with a child theme. The only difference with this page is that it is a modified template of the blog template.
The area causing trouble is called in my functions to grab the template part. All other pages do this fine except this one. Any idea?
I'm not entirely sure how to add code in here, but i'm happy to send anything along to help.
The page you've linked, seems to have encoding issues, i believe due to white spaces before the php tag, if you inspect the source, you can see:
��<?php
Check the script corresponding to the following comment (as per the source):
/**
* Template part for Media Feature Area
*/
And try to remove all whitespaces at the beginning and end of the script.
I have a problem showing my page visually the same on FireFox and Chrome.
Page renders correctly with Chrome (showing icons in two lines), but in Firefox icons break visually and create a third row. I think that the problem is with Bootstrap, but I don't understand why. I have tried different solutions, but nothing.
The page with this problem:
Link of the page: http://www.unishare.it/sedi/1
You have a lot of things going on in your HTML. Firstly, you shouldn't write any code outside of the scope. You should place your custom style elements always inside of the tag. Secondly, move bootstrap.css to the top. That is your css boilerplate (That is the css code that resets your visual settings across all browsers). All the other css files (font-awesome.css, slider.css, etc...) should be placed after the boilerplate css code/file.
After placing all library css files, your custom css files should be the last ones in the tag (I mean all the style codes at the top of your html page).
Try these suggestions and come back with the result. I believe you'll be good to go then.
EDIT: After taking a second look and playing your HTML with FireFox's dev tools, I created a solution for you. Just surround your "portfolio-boxes" divs with a row. They are not actually recognized as a seperate row in your DOM, that's why they don't appear in two seperate lines.
In short, you should create a div with a class of "row" for every "portfolio-boxes" div, seperately.
Does that solve your problem? If yes, you can vote up and select the answer ;)
I am new to SMF.
I just installed SMF on my website. I tried editing the index.template.php . After saving changes, it displays raw HTML and PHP on the browser. I tried fixing the prob by returning the the page back to the original state to no avail.
At the moment, everything is gibberish both frontend and backend.
Pls what do i do?
There should be at least an open tag at the top of the file (at the top of every .php file). Make sure you didn't remove this tag. Everything outside of a <?php is interpreted as normal text so if you have removed this it would explain your issue.
Also, being an ex-team member for SMF I can assure you its better to create a copy of the default theme, then make your edits to that theme. Then if you experience an error you can always pass a param in the url to reset to the default theme (in case you need to get into the admin area). To do so end the url with index.php?theme=1
I need to include the content, scripts, forms and dynamic abilities of one page in another onClick.
Take a look at http://www.divethegap.com/scuba-diving-programmes-dive-the-gap/dahab-master-scuba-diver.html
Then follow one of the links that says 'Beginner' 'Open Water Diver' etc....
You will find a PHP page with a series of options. It is an adaption of the wordpress blog system to produce only specific options for specific programmes by considering each type of each diving programme a category and then displaying only results from that category.
You will see that each option is also a collapsible panel and there are also several javascripts that calculate durations, quantities and prices. There is also a validating webform at the end.
Now go back to the first page. What I would like to do is include all the content from the second page after the main header inside tabbed panels on the first page so that the customers can immidietly see everything that is included. Essentially the options on the first page would become a series of tabs.
The only way I can see to do this is with an iFrame as each option would need a unique URL ending (that is .php?cat=26 or .php?cat=27). THe problem is that the collapsible panels will not work with an iFrame as the iFrame will not resize when the panels open. There were also some calculation problems, but I think that was more down to me staring at the screen for the last 3 hours not remembering to include everything.
I have tried it with resizing iframe SSI scripts and have got nowhere.
I tried actually embedding it in the page better with a ajax script, but that left behind all the scripts that make it work. I checked with full URL's on everything and it would not take work with any scripts.
I know that you could just make the whole page reload but then the user would be at the top of the page again, and even if another script was applied to slowly bring them down again it would not be anything near as easy to use as if it was like tabbed panels.
Any ideas.
Kind Regards,
Definitely no need for iframes. AJAX will do the trick here.
Here's a link with a demo + code:
http://www.dynamicdrive.com/dynamicindex17/ajaxcontent.htm