The user goes to a page with image A. If he presses the Facebook like button, it displays image A next to the url. He then navigates to an edit page, changes the image to image B, and then reloads the original page. The page now displays image B. He presses the like button and it's still showing image A.
I have
<meta property="og:image" content = "image_b" />
This thread will give you the answer.
Facebook catches pages. You basically would need to have that cache refreshed in order for your page to show a different image. Since this can only be done manually I would suggest using a form variable in your header so that facebook caches more then one page/url.
Related
I've a page where you fill a form to search on YouTube API and returns some videos with buttons to go to another page with details about the video. Then there is a button to go back to previous page, but when clicked it returns the page as was open (Without any results). Is there a simple way to load the page with this results?
You can save the search key in session storage when the user clicks the video button. That way you can always get it back when you return to the previous page.
I have a series of html pages that include a link to an informational page. In the menu for that page, I have a link back to the referring page that uses this code:
<a class="nav_link" onclick="location.href = document.referrer;" onmouseover="this.style.cursor='pointer'">Return to Text</a>
It works as expected on the first use, but if someone moves to another page and then clicks on the link to return back, it will sometimes take them to the old referring page. So, for example, if someone went to from page 1 to my referring page, returned via the link this anchor tag generates, and then went to page 3 and clicked on the link to the informational page, upon clicking on "Return to Text" for a second time they might go back to page 1 rather than page 3, as expected.
I'm assuming that the issue is that document.referrer is being stored in memory and is not being overwritten when the user clicked on the link to go to the informational page a second time. Why is this, and is there a way for me to either make sure the memory is always cleared when they click on the link to return or create a more robust version of the location.href = document.referrer; onclick?
If you want a "back link," you're better off with history.go(-1):
onclick="history.go(-1);"
That actually emulates the back button, rather than adding a new entry to the history with a repeat of the previous URL.
I am working on an HTML website where I have 4 divs in an index.html page.
Earlier on clicking the div section used to expand it and the other section became smaller in width.
Then the client asked to make sure that the URL was changed when we click any of the div.
Suppose we click the div called test. The page url shoul become /test.html, without the page reloading. I have implemented this functionality using the history API.
Now when I click on the test div and the url becomes /test.html and then if I click a link, it redirects to another page.
From this page, if I click on the browser back button, then it takes me to /test.html which does not exist and we get a 404 error.
I tried making a redirection page called test.html which redirects back to the index.html page, but we get a blink while doing so.
What I want to ask is whether there is a solution for this problem?
If you have mod_rewrite enabled on the web server, you could set this up as a URL rewrite rule.
RewriteEngine On
RewriteRule ^test.html originalfile.html [NC]
This will redirect test.html to the original html file when the user presses the back button and navigates to test.html while the browser address bar still displays test.html. From here, you should be able to detect the address in javascript and display the appropriate div.
(Note that you will probably need to modify the above rewrite rules depending on how your server is configured. For more information about creating rewrite rules, see this link.
I'm using jQuery Mobile (no php or xml or anything else) for a web application running on cherrypy and i would like to find out how can i keep the page as it has been set by user even after refreshing.
As an example of the page, see this fiddle: http://jsfiddle.net/xaKXM/5/
in this example, user may input certain text in Response number and description. When the user click submit,user will see #configtable div. if the page is refreshed, user will not go back to the initial page (#labels div' )but to remain in the#configtable` (the one that user can't input anything but can only click activate button")
May be there is a button that would clear all those states and the page will go back to default when refresh?
Is this possible to be done?
if you refresh the DOM using window.open('index.html'); this should clear everything in the page
I am creating a web application.
I have a landing page which the user sees after logging in.
From the landing page they can click a link to go to detail page.
The detail page loads data for the default id to start with. It also contains a drop down for user to pick a different id. When user presses submit button it makes a get request to the same page, but uses the optional argument id=someID this reloads the page and shows the data for the newly selected id. All of this is working correctly.
My question is, if user chooses a few different ids from the drop down and clicks submit to view their data, now if he wants to get back to landing he has to go back through each id that he viewed. I would like to know if it is possible to set it up so that when they press back button they will go directly to landing page no matter how many times they've chosen new id's to view data for.
Here is the flow I'd like to achieve:
/landing -> /detail -> /detail?id=1 -> /detail?id=2 -> [press back button] -> /landing
Have the requests on the details page pulled in via ajax. You have to do some refactoring so that on a successful request, the information it receives will repopulate like a content block, but this will allow the information on the details page to update without you actually navigating to a new page. Then it'll leave you the ability to press the back button to go back to the landing page.
If you're already using a way to catch the amount of id's requested:
<INPUT Type="button" id="back" VALUE="Back" onClick="history.go(-"number of id requests");return true;">