Redirect URLs with Jekyll - jekyll

I migrated to a Jekyll website from WordPress. Now I already manage redirect with jekyll-redirect-from plugin. My website is hosted on Github Pages which doesn't give me access to .htaccess file.
I know how the Jekyll Redirect From plugin works.
I need to redirect images to different URLs without losing images I have already indexed in Google. Is there a way to do it?
In Google Search Console I see a lot of pages detected but not indexed that have URLs like this:
<my website>/post/?doing-wp-cron=xxxxxx
I think these URLs come from the old website on WordPress where the cron task was active.
I want to redirect all the URLs:
<my website>/post/?query-id=value
in:
<my website>/post/
Basically, I want to redirect URLs with query string to same URLs but without query strings. Is there a way to do this in Jekyll on Github Pages?

A solution to this problem would be to use JavaScript to parse the URL and perform the redirect:
if (window.location.href.indexOf("?query-id=") > 0) {
window.location = window.location.href.split("?")[0];
}
This solution redirectd any URL with a query string to the same URL without the query string.

Related

HTML file structure's affect on website URL

I currently have a simple website, hosted on github pages with a file structured in hierarchical directories as shown below:
/foobar.com
/css
/js
/images
/html
/news
/news_content
fizz.html
buzz.html
news.html
about.html
contact.html
index.html
However, when I am on the buzz webpage for example, this has resulted in the URL to become:
https://foobar.com/html/news/news_content/buzz.html
Is there a way to change this URL so that it doesn't show all the folder directories and instead, just the file itself i.e. https://foobar.com/buzz.html as I don't want to separate all the individual HTML files into separate folders?
Yes, you can change the URL to be more user-friendly by using server-side URL rewriting or client-side JavaScript.
For server-side URL rewriting, you'll need to use a web server such as Apache or Nginx and configure it to rewrite the URLs. You can find more information on how to do this for Apache or Nginx by searching for "URL rewriting" on their websites or forums.
For client-side URL rewriting, you can use JavaScript to manipulate the URL shown in the browser's address bar. However, this method may not be ideal for search engines or users who have JavaScript disabled.
If you are using GitHub Pages to host your website, you might be able to achieve URL rewriting by using Jekyll. Jekyll is a static site generator that supports URL rewriting and can be used in combination with GitHub Pages to host your website. You can find more information on how to do this by searching for "Jekyll URL rewriting."
How a URL is resolved to a resource depends on the HTTP server and/or the server side programming language you are using.
Github Pages provides no features that allow anything other than a direct reflection of the directory layout in the URL.
The closest you could come would be to write a program that transformed the input (the file structure you want to work with) into the file structure that Github Pages will express as the URLs you desire (and then run it as a build step that takes the pages out of your working branch and into your gh-pages branch; possibly you could use actions to do this).

Specifying index.html in browser to load home page

If I want to load the homepage of https://medium.com/ by typing the exact index.html file address into my browser, how would I do that? Or is it not possible?
https://medium.com/index.html gives me a 404 error. Also curious how I would do this more broadly with any webpage for which my browser is displaying a url that does not end in .html.
Common static websites hosted just as files somewhere usually have an index.html document which can be resolved either directly or is normally loaded when no particular document is specified so https://example.com/ and https://example.com/index.html both work.
But this is not how most webs work. Pages can be dynamically generated server side, you just send a request to the server and if the path matches some server operation it will create a response for you. Unless https://example.com/ returns documents from a directory using something classic like the Apache Web Server set to serve static files from a directory, it won't work.
There is no general way to know what, if any, URLs for a given website resolve to duplicates of the homepage (or any other page).
Dynamically generated sites, in particular, tend not to have alternative URLs for pages.

getting 404 for links with create-react-app deployed to github pages

I'm trying to deploy a create-react-app to a relative path on GitHub pages with a custom domain. E.g. www.example.com/myproject
I'm using react-router-dom, react-router-redux and react-router-bootstrap
I've set homepage to http://www.example.com/myproject in packages.json (tried homepage = "." too) and also configured basename for my history:
...
export const history = createHistory({ basename: '/myproject' });
const middleware = [thunk, routerMiddleware(history)];
...
const composedEnhancers = compose(applyMiddleware(...middleware), ...enhancers);
const store = createStore(rootReducer, initialState, composedEnhancers);
The deployed app works on www.mydomain.com/myproject and I can navigate via the app links.
But I got 404 when I try to enter a path directly (eg. www.example.com/myproject/account) or if I do browser refresh on a subpage.
Long term goal is to configure different relative paths for dev and prod environments as described in this answer but first I just need to make it work in deployment.
Problem: URL gets evaluated on server side
When you enter a new URL into address bar of the browser or refreshes the page, browser requests server (in this case GitHub pages server) for that URL. At this point, client side router (react-router) can't take action as it is not yet loaded for that page. Now server looks for a route that matches /accounts won't find it (because routing is done on client side) and returns 404.
Solution
If you had control over the server, you can serve index.html for all routes.
This is explained in create react app documentation serving apps with client side routing.
As we don't have that control in case of GitHub pages, We can try these.
Easy Solution
Switch from browserHistory to hashHistory
With this change, your URLs will go from looking like
www.example.com/myproject/account
to
www.example.com/myproject/#/account
So it's a bit messy.
Harder solution
Get GitHub pages to redirect to index.html on all requests. Basically you have to add a 404.html in your build directory with code to redirect to index.html. More on how to do that.
Create React App has documentation around client-side routing in GitHub pages too
The best way to solve the issue is create a copy of index.html and call it 404.html for production build. To make it add this to package.json scripts:
"build": "react-scripts build && cp build/index.html build/404.html"
The reason is because the browser may not have cached the routing code yet so it causes a 404 error if you go to a route other than the index.
Side note if anyone is using ZEIT Now to deploy (although gh-pages would be similar); I managed (after a deal of time) to work out how to fix it. It was a bit of an effort so I decided to make an article on it for anyone else who gets stuck.
https://itnext.io/fix-404-error-on-single-page-app-with-zeit-now-b35b8c9eb8fb

How to redirect readthedocs web pages to other website

We started having our project's docs on readthedocs site (say http://abc.readthedocs.org). For various reasons we now moved to our own web servers with new domain (http://abc.io).
We want to bring down http://abc.readthedocs.org gracefully so that our project documentation is not broken all across the internet.
One way we are thinking is to have "redirects" from all pages with prefix (http://abc.readthedocs.org) to (http://abc.io).
But, I don't see any redirection options in readthedocs site that provides redirection to completely new domain. Readthedocs only allow redirection within different pages under same domain.
Any pointers on how I can proceed would be very helpful.
Read the Docs offers several kinds of user-defined redirects:
Prefix redirects (e.g. /dev/... -> /en/latest/...)
Page redirects (e.g. [/$lang/$version]/example.html -> [/$lang/$version]/examples/intro.html)
Exact redirects (e.g. /dev/install.html -> /en/latest/installing-your-site.html)
To migrate from an old Read the Docs project to somewhere else, the project is more involved:
Add an Exact Redirect from /$rest to https://new.domain/
Deactivate all versions of the old project, except latest (which can't be deactivated)
Create a repository with a Sphinx project that only contains an index.rst with the following markup:
.. meta::
:http-equiv=Refresh: 0; url='https://new.domain/en/latest/'
Change the repository URL on https://readthedocs.org/dashboard/oldproject/edit/ to such repository
I added the following section to my index.rst:
.. raw:: html
<script type="text/javascript">
if (String(window.location).indexOf("readthedocs") !== -1) {
window.alert('The documentation has moved. I will redirect you to the new location.');
window.location.replace('http://cosmo-docs.phys.ethz.ch/cosmoHammer');
}
</script>
On the ReadTheDocs Admin page, the "Exact Redirect" form of redirection allows other domains in the "to URL" field. But it only seems to redirect one page per rule. That is, it requires an "Exact" match. I was hoping for some mod_rewrite magic using (.*) and $1. But that is not set up.
Another idea that works (but is clunky) is to create a temporary repository with a docs folder that uses markdown. The index.md file can consist of a refresh:
<meta http-equiv="refresh" content="0; URL=https://new.location">`
You can also add html with a direct link in case the refresh doesn't work.
The conf.py file can be:
from recommonmark.parser import CommonMarkParser
source_parsers = {'.md': CommonMarkParser}
source_suffix = ['.md']
master_doc = 'index'
Commit this repository to github (or other host) and change the project URL for your RTD project to this temporary repository. You can create tags for the temporary repos. to match those of your actual repository. Then make sure ReadTheDocs builds each version. If all goes well, the home pages of each version will redirect to wherever your refresh sends them.
It would be nice if the Redirects available on the Project Admin page would allow redirects of prefixes to other domains.

Search and replace from a list of replacements

Using html import 2 plugin for wordpress, I've gathered a list of old file-paths and what they've been changed to.
Instead of bulking up my .htaccess with redirects, I was hoping there was a way to replace all the old links with the new ones.
For instance, i have a list:
oldlink1, newlink1
oldlink2, newlink2
oldlink3, newlink3
oldlink4, newlink4
and I want to replace every occurence of oldlink1 with newlink1. possible?
Are you asking about file and images paths in the post content? (1) Or are you asking about post permalinks to redirect the old .html URLs to new WordPress URLs without the .html suffix? (2)
1) For file image paths in post content, probably the easiest and most foolproof approach is to use a find/replace plugin that will provide a front end to the database so you don't run queries directly on the database.
Try http://wordpress.org/plugins/search-regex/ With it, you can find/replace post content, post meta, comment content, etc.
Search Regex adds a powerful set of search and replace functions to
WordPress. These go beyond the standard searching capabilities, and
allow you to search and replace almost any data stored on your site.
In addition to simple searches you have the full power of PHP's
regular expressions at your disposal.
2) For URL redirects, you can try http://wordpress.org/plugins/redirection/ which will allow a CSV import of URL redirects while logging 404s and redirects.
Redirection is a WordPress plugin to manage 301 redirections and keep
track of 404 errors without requiring knowledge of Apache .htaccess
files.... This is particularly useful if you are migrating pages from
an old website, or are changing the directory of your WordPress
installation.
With this script you can do a search & replace on your WordPress database. Just follow the instructions, and don't forget to remove the script after you're done.