I'm having a problem, or better to say a doubt about how to do.
Let's explain: I have an website similar to a blog where I write articles and they are displayed in the homepage. I want that every time I click on an article it redirects me to the page where the article's content is shown. I save every article in a database with the title, date, content, etc... My doubt is: should I create a .html file for each article or only a file called "article.php" and when I open it, it changes the content getting the data from the database?
Second question: I want that the url of the page changes based of article that I click. For example I click on the article called "Today and Tomorrow", I want that the URL appears as "mysite/today-and-tomorrow/", not "mysite/article.php".
I'm a bit confused about this topic so if anyone can help me i'd be very happy.
Thanks in advice.
I have tried
var link = 'www.example.com/training/product.html';
link.split('.html')[0];
window.history.replaceState( null, null, link );
But it changes the URL dinamically, so for a few seconds it appears the original URL, in my case it appears "mysite/article.php" and then it changes in "mysite/today-and-tomorrow". I don't think it's properly correct.
I also tried
function openArticle(title){
var rightTitle = $(title).text();
rightTitle = rightTitle.toLowerCase();
rightTitle = rightTitle.substring(rightTitle .indexOf(':')+2);
rightTitle = rightTitle.replace(/[^A-Z0-9]+/ig, "-");
event.preventDefault();
window.location.href = title.href + "/" + rightTitle;
}
But when I click on the element the "article.php" remains in the url
should I create a .html file for each article or only a file called "article.php" and when I open it, it changes the content getting the data from the database?
No you dont have to. You can pass article id as a "query string" to "article.php" and it will take care of providing proper article to the end user.
I want that the url of the page changes based of article that I click. For example I click on the article called "Today and Tomorrow", I want that the URL appears as "mysite/today-and-tomorrow/", not "mysite/article.php".
You are talking about a feature called "URL Rewriting" which produces nice & meaningful URLs. In order to implement it you need to:
Design your database in a way which it can map articles id to its title.(for creating alias)
You have to enable URL Rewrite in your web server. (for example if you are using Apache as web server, you need to enable mod_rewrite).
You have to embed your rules for mapping & routing nice URLs to the original ones in a file called .htaccess. as a sample How to write htaccess rewrite rule for seo friendly url
I was just trying to help you get an overall idea of what you are looking for from technical point of view & as you know Its impossible to cover your required information in just a single post.
Related
I'm creating a single-page site, and I came across a problem that I can not solve. I have my menu with "Home | Blog | Contact" etc, change the URL with the javascript without updating the page with the code below:
window.history.replaceState({url: stgUrl}, "", stgUrl);
so I can see that the URL is modified correctly, the problem is that my site is in two different languages, and I want to put something like "/pt/" e "/en/" so the user can better visualize what language is browsing. The problem is that when I do this:
window.history.replaceState({url: stgUrl}, "", '/en'+stgUrl);
I get file upload errors, such as site images(Get 404: Not Found), which are not finding the path correctly anymore, because of '/en'.
since the changed url looks like this: mysite.com/en/
I would also like to add comments to blog posts on the site, and I saw that to add Disqus comments, I would need to have different urls for each post, so I can better control the comments, it's also something I do not know how to do.
obs: my site will be hosted without access to a server, so everything should work on the client, like a static but one page blog.
And how do I update the page with the url changed without receiving a 404? I would like to go to the home page for example, or update and maintain the current page.
So my question about urls comes down to three questions:
1 - How to change the url with "/pt" and "/en" and not receive 404 for images not found?
2 - How to change the url in order to generate comments from Disqus?
3 - How to update the page with the url changed without receiving a 404?
I have around 50 links in footer section in this static app. Is it possible to not create html files for all 50, instead create one html file with data related to all 50 links and hide/show relevant data based on clicked link?
Scenario:
User clicks a link, referred to url as http://{url}/clicked-link-id/
User sees data based on the clicked-link-id
I know its easy with Angular, but I am not allowed to use ui-router or any other framework/libs.
One approach which can be followed here is to parse the url to retrieve the clicked-link-id using JavaScript.
Once the clicked-link-id is obtained, a function can be written to display the element with content related to the link.
There are many ways to split the url to find the relevant info.
One crude way to do it assuming the link retains the structure shared by you:
var url = document.location.href;
var splitUrl = url.split("/");
var linkId = splitUrl[splitUrl.length - 1] || splitUrl[splitUrl.length - 2];
There are other things which also need to be considered here.
There needs to be a configuration probably on the web-server side to redirect all the page requests with a certain structure to the page which contains this logic. Otherwise you might get 404 error for all such requests.
I am using the OneDrive JS Picker and would like to get both a download and share value. The sample in the documentation lists the options for the action parameter separated by pipes. I was hoping to use bitwise operators to combine those values (e.g.
action: "share | download"
but that doesn't seem to allow both the webUrl value and the download url (#microsoft.graph.downloadUrl)... has anybody else been able to do this? Or is there a way to use the share URL (webUrl) to get a download url so we can get the text contents of files?
I know there is a REST service available though that may be deprecated, given the message at the top of that page:
This documentation is archived and is not being maintained.
but if that is still usable, perhaps we could use that to download the file... if so, can I put the file id in that download URL and an access token?
I was able to host the OneDrive.js file locally, un-minify it and modify the line below (line 104) to have the downloadUrl included in all queries on files. That allows us to get a shareUrl and a downloadUrl.
e.DEFAULT_QUERY_ITEM_PARAMETER = "expand=thumbnails&select=id,name,size,webUrl,folder,#content.downloadUrl";
sorry for the missleading pipe sign. Actually right now we only allow one action per request like (action: "query"). The pipeline sign in the doc means 'or' in English not in code.
Before my answer, I want to clarify the difference between a webUrl and a shareUrl.
A webUrl which you see in the response's 'webUrl' attribute is the
url pointed to the resource online which requires user login to see
it.
A shareUrl which contains the permission which everyone who has the
link could see/edit it based on the user's config.
JS Picker
If you want the download link and a webUrl back at the same time, it should be easy:
{
action: "query",
advanced: {queryParameters: "select=id,name,webUrl,#content.downloadUrl"}
}
If you want both the download link and share link back at the same time, it is not supported.
API
For using the API to achieve this, you can go to the new API page: https://dev.onedrive.com/items/get.htm
and get the item with already shared links should be
GET /v1.0/drive/items/<item-id>?select=id,name,#content.downloadUrl,webUrl&expand=permissions
all already shared links should be returned in the permissions array object.
If you don't have a shared link, and you need to create the shared link, you should try https://dev.onedrive.com/items/sharing_createLink.htm
while it does not return the webUrl and download url back so you need an extra request.
Im struggling to figure out the best way to redirect/rewrite urls with some pattern matching using javascript.
BACKGROUND:
I have a blog filtered by tag: http://adrtimesv6.squarespace.com/library/?tag=The+Psychology+%26+Neuroscience+of+Mediation (select view as visitor if that comes up)
I have another area in the site called "Collections" where i load in groups of posts from the library in its own real page with other content in a more controlled environment with page titles and urls that are better for seo, like this: http://adrtimesv6.squarespace.com/collections/the-psychology-and-neuroscience-of-mediation. the posts are loaded in via a query that pulls in posts from the library that have a tag that matches the name of the collection page. this is working pretty well. the problem im running into is that when someone filters the blog posts by tag i want them to be redirected to the collection page rather than go to the blog filter page.
QUESTION:
What im trying to figure out is how to use jquery to redirect all the /library/?tag=[path] urls to /collection/[path] urls. To do this i think i need to use jquery to:
1) swap "/libary/?tag=" to "/collections/"
2) revise the rest of the path from the tag formatted path "The+Psychology+%26+Neuroscience+of+Mediation" to my collection formatted path: "the-psychology-and-neuroscience-of-mediation"
ADDITIONAL INFORMATION:
I am using a CMS so i dont have access to things like the .htaccess file. in the CMS admin settings there is a url redirect panel that allows me to list some basic redirects in this format: -> ... but trying this with the tag filter urls is not working.
Im mostly concerned with this redirect occuring when the user clicks on the tags listed at the bottom of the blog post - so i could use jquery to modify the href attribute in the tag listed for the blog post. just not sure how to write the pattern matching and rewrite the format correctly. ive tried a bunch of things but cant seem to get it.
or perhaps use window.location.replace somehow?
UPDATE:
In my particular case, i found that i could update my template code and json formatters so that the tag link href generated matches the url in the collection section - so my problem is solved ....however, i still wonder how i would do handle this for other situations.
basically, 1) how to use javascript or jquery to check if the url (either href on the page or the browser url) contains something, then replace that with something else, and then modify the full url so that it is a simple dashed url .... takes out all + signs and replaces them with - and removes the %26 for & characters to return a simple url string, etc, like: /here-is-the-path
On a single page, you can use this to forward a visitor to a new page:
window.location = "http://www.google.com"
You could add logic to use the same script on every page. For example:
if ( document.location == "http://adrtimesv6.squarespace.com/library/?tag=The+Psychology+%26+Neuroscience+of+Mediation" ) {
window.location = "http://adrtimesv6.squarespace.com/collections/the-psychology-and-neuroscience-of-mediation"
}
and so on. You could even add more advance string manipulation to handle every URL.
But doing a JavaScript redirect in this manner will not have positive SEO effects such as friendly URLs. It will not enable your web server to handle the new URL; if http://adrtimesv6.squarespace.com/collections/the-psychology-and-neuroscience-of-mediation returns an error from your web server, no amount of front end JavaScript will be able to fix that.
Doing this with JavaScript this would probably be a negative experience for your users, because they would first have to download the page from the first URL, then execute the JavaScript, and then download the page from the new URL.
On my website, Like buttons are generated dynamically. The URLs associated with these Like buttons are links that automatically redirect (with htaccess) to its respective hashtag url (i.e. ".com/event/200" redirects to ".com/#event/200"). The issue is that I can't seem to set the title or image. When a page loads with a hashtag, a database is queried and then the page title, meta data, and other things are changed. Facebook seems to be using the metadata that's set before the database has had time to load and the content has been changed. Does anyone have any idea how I can solve this problem? I'd love to be able to set the title and image when the like button is loaded if there's anyway to do that. Here's my like button code:
<fb:like href='http://website.com/"+postname+"/"+data.id+"' send='true' layout='button_count' width='450' show_faces='true'></fb:like>
The URLs associated with these Like buttons are links that automatically redirect (with htaccess) to its respective hashtag url (i.e. ".com/event/200" redirects to ".com/#event/200").
That’s your error right there.
Since the Hash part of an URL does not get transmitted to the server, it’s only usable client-side. So redirecting to it server-side is a really bad idea, since you know nothing about the client’s capabilities (f.e. if it supports JavaScript).
Don’t do server-side redirects - make them client-side instead, via JS.
This tutorial shows how to basically go about making an “AJAX-Page” crawlable: http://support.google.com/webmasters/bin/answer.py?hl=en&answer=174992