slide show not works in downloaded site - javascript

I've built a site http://ucemeche.weebly.com , Now I want to transfer it on other server. http://Weebly.com provides a function to download whole site in zip format that I've done.
But problem is when I am browsing that downloaded site the slide shows, photo gallery etc are not working in as working in live site. Perhaps it is related to java script.
Why is it happening ? What is the solution ?

Check the paths of the javascripts. You might be missing some scripts or you do not include them properly.
Check the error console in your browser. Most likely it will show you what's wrong.

You simply have to change the paths to the images in the html file
the paths will be something like:
"2\/1\/2\/5\/56254238\/3375189.png"
change them to:
"..\/folder name where your files are\/uploads\/2\/1\/2\/5\/56254238\/3375189.png"

This was three years ago, so perhaps this is a late answer. There is a hosted file slideshow-jq.js. In it, there is a function largeURL(photo).
Copy that slideshow-jq.js into the root of your zip, and edit the file:
url = '/uploads/' + url.replace(/^\/uploads\//, '');
Remove the leading / in front of uploads.
Now, update your page and look for this line:
<script src="http://cdn2.editmysite.com/js/site/main.js?buildTime=1234"></script><script type='text/javascript' src='http://cdn1.editmysite.com/editor/libraries/slideshow-jq.js?buildTime=1234'></script>
Or something like that. Change the src to the local file, "./slideshow-jq.js"
That corrects the issue.

Related

djangobyexample book - jquery bookmarklet not working at all

I'm working through Django By Example and in one chapter a jQuery bookmarklet is built within a Django app so that a user can easily save jpg images from a website into their user profile area within the Django app.
The tutorial does give exact instructions on what to do which I have followed and although I have managed to get the bookmarklet button to appear in my bookmarks bar in Chrome, nothing happens when I click it when browsing a webpage with jpg images.
This is my local Django dashboard where the bookmarklet button is added to the bookmarks bar and this part works fine
and this is how it must look like when clicked on the bookmarklet, this is the part where nothing happens for me when I clicked on bookmarklet.
(how to solve this?)
These are the relevant js files
https://github.com/davejonesbkk/bookmarks/blob/master/images/templates/bookmarklet_launcher.js
https://github.com/davejonesbkk/bookmarks/blob/master/images/static/js/bookmarklet.js
I believe the JavaScript launcher is unable to load the JavaScript files or the JS launcher itself is not getting loaded.
The JavaScript launcher is getting called through a Django template tag "include" inside the anchor tag.
this is the link:
https://github.com/davejonesbkk/bookmarks/blob/master/account/templates/account/dashboard.html
I tried debugging it through CTRL+SHIFT+I console where trouble showed that "include" tag not working properly.
Your include tag is split over two lines:
images from other websites → <a href="javascript:{% include
"bookmarklet_launcher.js" %}" class="button">Bookmark it</a><p>
Django does not support multiple line tags. Change it to:
images from other websites → Bookmark it<p>
I have faced the similar error while going through the book.
The bookmark button is not functioning,when i debugged it through chrome debugger,i could able to see errors at js level.I have made two changes to resolve these errors.
1.Error message: net::ERR_ABORTED
Action step:
In the book its mentioned that to place bookmarklet.js in images application directory,but in bookmarklet_launcher.js the source is refered to below path
http://127.0.0.1:8000/static/js/bookmarklet.js?r=
So place bookmarklet.js in /static/js/ directory inside images application(if folder structure not available create it).
2.Error message: net::ERR_ABORTED
There is one more file that should be placed which is bookmarklet.css which is being refereed at below line in bookmarklet.js.
href: static_url + 'css/bookmarklet.css?r=' + Math.floor(Math.random()*99999999999999999999)
Action step:
create a file bookmarklet.css inside /static/css/ directory and place the css code.Refer below link for css code:
Git Hub link for css code reference
1.After the above steps,restart the development server.
2.Drag the bookmark it button to create a bookmark in browser.
3.Open any website that is HTTP(not https) and click on bookmark it(The one which is bookmarked in browser not bookmark it button).
4.The below pop up appears
the problem is that template doesn't exist so try t do the following
**
1. make sure your include code in same line
2. make sure same name of the template exist on your project director /images/templates/file_name.js.
3. or go to setting and add your templates directory to templates.
4. if it load but no images views don't forget that you only accept jpeg and jpg images only
** so you can try another sites like wikipedia **
I was able to solve this by making sure that the url from ngrok tunnel in the bookmarklet.js and bookmarklet_luncher.js starts with https not http
Instead of this http://127.0.0.1:8000/static/js/bookmarklet.js?r= it should rather be
https://127.0.0.1:8000/static/js/bookmarklet.js?r=
After 4 hours of doing everything... googling, deleting code, and rewriting code...
Only had to hit Ctrl+C to stop server and re-run server .
Just take a break and come back to fix it :)
Mine works same as instructed in the book – no changes, no nothing.
Only restarted the server.

How would you make it so when you visit one of your pages on your website, it doesnt have the .html

When you visit a url like https://www.youtube.com/feed/trending it doesnt have .html or .php. Using html or javascript how would I do this? My website is http://www.artsicleprojects.com and when I go to a page like "Nothing" it says http://artsicleprojects.com/nothing.php.
So basically, what I want to do is make it so it says
http://artsicleprojects.com/nothing when you go to the page
Thanks!
OK, so you'd take your nothing.html/nothing.php file, change the name to index.html or index.php, then create a folder called 'Nothing', and put your index file there. Then go to www.example.com/nothing, and the index.html/index.php would automatically run without showing in the URL.
Did this help? If so, please accept my answer. :)

Shadowbox.js downloads html files instead of displaying them in an iframe

I'm pulling my hair out over this one. I'm using a very simple version of shadowbox - it works correctly when I'm using images but when I use a URL to display in the modal, it will open a blank shadowbox and then download the html link in the href as a file to my downloads folder.
<a class="galleryItem" rel="shadowbox[Gallery];height=165;width=640;player=iframe;" href="/Bios/MR.html" title="MR">
And the simple init is just this:
$(document).ready(function() {
Shadowbox.init({
player: "iframe",
handleOversize: "drag"
});
});
I've tried so many variations of the options at this point and I'm stuck.
This one has been resolved - I left out one detail I didn't think was relevant at the time but I was on an O365 environment and changing the file extensions from .html to .aspx fixed the issue. I'm answering my own question because I hope this can help someone else.

Javascript images error in wordpress

After moving to Wordpress the images of weather cannot be retrieved even though the JavaScript code runs fine. Here is the code that I am using to retrieve images in custom.js. The code:
$('#weather').openWeather({
city: 'New York, US',
placeTarget: '.weather-place',
iconTarget: '.weather-icon',
customIcons: 'files/img/icons/weather/'
});
There is something wrong with
'files/img/icons/weather/'
Well firstly when using html the javascript was in files/js/custom.js and the images were in files/img/weather/ it worked but now with wordpress it does'nt work
Your help would be appreciated.
The files folder is in the root directory.
If your files directory branches off the root, then try adding a slash before the word "files", like so: customIcons: '/files/img/icons/weather/'
Else, you may need to provide the entire path http://www.mydomain.com/files/...
ALSO, you're not providing a file name /files/img/icons/weather/icon.jpg
If you moved to wordpress, the paths might have changed. Where do you keep your javscript library?
I would use the debug console from your browser to see what happens and which icons your script is trying to get and then modify the path. (press F12 and click on the "network" tab, reload the page and check for 404 errors)

js file path is correct but it cant be loaded

I'm using ASP.Net Dynamic Data. I have the following line in my site.master page.
<script src="../Scripts/jquery-ui-1.8.20.custom.min.js" type="text/javascript"></script>
The path is correct and file exists. But when I load the page I can see in the Net panel of firebug that it cant find the file. Error message is "404 Not Found"
Approach - 1
You should modify the code like as mentioned in below ways...
~/Scripts/jquery-ui-1.8.20.custom.min.js
"<%#ResolveUrl("~/Scripts/jquery-ui-1.8.20.custom.min.js")%>"
in the first case replace the .. with ~
Approach - 2
Alternatively, Right click the Page and select View Source. click the link of your Script file and check if it navigating to your actual Script file? Otherwise make the necessary changes as mentioned above.
I dont trust your url :)
use :
<script src='ResolveUrl("~/Scripts/jquery-ui-1.8.20.custom.min.js")' type="text/javascript"></script>
also , please verify - you load the jQuery.js BEFORE you load this line.
When you use ../ at the beginning of a url, it is the browser's current url that is taken as the base. So that url will only work when you are at exactly one directory level down from the site root, like this:
http://myserver:myport/myvirtualdir/somedir/somepage.aspx
Or this:
http://myserver:myport/myvirtualdir/somedir/ (using a default page or view)
Then, the browser will load the following script:
http://myserver:myport/myvirtualdir/Scripts/jquery-ui-1.8.20.custom.min.js
But if you are at any other directory depth, the browser will use the wrong url for the script. Like if you are at the root default page:
http://myserver:myport/myvirtualdir/Default.aspx
Then the browser will try to load the script from the wrong directory:
http://myserver:myport/Scripts/jquery-ui-1.8.20.custom.min.js
That is why you need to resolve the url on the serverside, like a couple of people have already said here. That will provide the browser with a working url for your script. There's a difference between file paths and urls.
The fact that you are getting a 404 means that the url that the browser is trying to reach is simply not correct, from the browser's point of view, which is in fact the only point of view that is valid, even if you, the developer, is convinced that you are doing it right...
<script src="<%#ResolveUrl("~/Scripts/jquery-ui-1.8.20.custom.min.js")%>"></script>
As Royi mentioned make sure you have the jquery.js before you have your jquery-ui.js
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script src="Scripts/jquery-ui-1.8.20.custom.min.js" type="text/javascript"></script>
Here is a tip. open site.Master designer then drag and drop the .js file from the Solution Explorer into the designer. It would create the path for you.

Categories

Resources