Is there a way to point my Github URL to the index file within a specific folder?

The actual working location of my website:

My desired working location for the site:

Originally, I had my index.html file in the main repository, but later moved it to an html folder along with other html files for better organization. How can I ensure that it functions correctly with the following setup:

<head>
<title> NAME </title>
<meta name="viewport" content="width=device-width">
<link rel="shortcut icon" type="image/ico" href="/favicon.ico">
<link rel="stylesheet" href="../css/index.css">
</head>

<section id="Site">
<h3>
<a href="../html/">FIRST LAST </a>
</h3>
</section>

My desired working location for the site:

Thank you

javascripthtmlcssgitgithub

Answer №1

It seems that according to the GitHub Pages documentation, you are unable to set up the "main page" in a location other than the root of the repository or a folder named docs.

However, there are some workarounds you can try:

  1. You could attempt using an .htaccess file for setting up a 301 redirect. I'm not certain if this will work on GitHub Pages as I have not used this service before.

  2. You may also consider placing an index.htm file in the root directory of the repository and creating a redirect from it. Here is an example code snippet:

    <meta http-equiv="refresh" content="0; url=http://example.com/" />

If you need more guidance on implementing a redirect in HTML, you can refer to this question on Stack Overflow: Redirect from an HTML page. Keep in mind that the redirect will only apply to specific files you create (such as index.htm), and they can only lead to one destination. This solution may not allow you to redirect all requests to the page to the /html/ folder.

Answer №2

In order to correctly link to your index.html file, you should use the relative path approach. This would look like:

<a href="../html/index.html">FIRST LAST</a>

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

As soon as I hover over my icon to enlarge it, I notice that my entire page starts to

Whenever I hover over my icon, the font size increases causing the div to expand slightly and move the page. This doesn't look great. How can I prevent the div from resizing when hovering over the icon? Here's my code: <div className="bg- ...

htmlcssreactjsreact-nativesass

Exploring the Function Scope within ViewModel

I have been facing an issue while trying to call a function from my ViewModel within a foreach loop. It seems like the function goes out of scope as soon as I call it. Being new to JavaScript, I am struggling to understand why this is happening. Here is t ...

javascriptjqueryknockout.js

Navigation menu consist of two horizontal rows

I'm facing a challenge. I have a total of 8 links (one being a button) on a navigation menu that I need to display in two rows on the right side. I'm having difficulty aligning them properly while also justifying them to the right. Essentially, t ...

htmlbootstrap-4

Remove the default selection when a different option is chosen using Bootstrap

I have implemented the Bootstrap-select plugin () for a multiple select dropdown on my website. Upon page load, there is a default option that is already selected. See image below: https://i.stack.imgur.com/SzUgy.jpg <select id="dataPicker" class=" ...

javascriptjquerytwitter-bootstrapbootstrap-selectbootstrap-selectpicker

Begin with a Bootstrap non-fluid container and follow with a fluid container

I am currently facing a challenge where I want the lower section of my webpage to be full width within a container-fluid div, while keeping the top part in a traditional container with a set width. Despite my efforts, the following HTML snippet is not ach ...

htmltwitter-bootstrapbootstrap-4

Inject HTML code containing a function that triggers upon button press

I am facing a challenge in inserting code through a submit button. Essentially, I am looking for this button to trigger a PHP function that adds a block of HTML code. Below is the function: function addTrainee(){ print_r('<form method="post&qu ...

phphtml

Chrome not handling text wrapping within table cells properly

I'm facing an issue with a table I created using the bootstrap stylesheet. For some reason, the cells are not wrapping correctly in Chrome, although they display perfectly fine in IE and Firefox. You can check it out here: <form action="todos" m ...

htmlcsstwitter-bootstraphtml-table

Why is Chrome not enforcing the maximum attribute for input type number in HTML5?

I'm encountering an issue with the following code snippet: <input type="number" max="99" /> While using Google Chrome (and possibly other webkit browsers), it appears that the spinner's up arrow is restricted from going over 99. However, ...

formshtmlgoogle-chrome

What is the best way to arrange an array of words expressing numerical values?

Is there a way to alphabetize numbers written as words (one, two, three) in Javascript using Angularjs? I need to organize my array of numeric words $scope.Numbers = ["three", "one", "five", "two", ...... "hundred", "four"]; The desired output should be ...

javascriptangularjs

Adding clickable padding to a Draft.js editor can enhance the user experience and make the editing process

Is there a way to apply padding to the Draft.js Editor so that clicking on the padding area selects the Editor? If I add padding directly to the container div of the Editor, the padding displays properly but clicking on it does not enable writing in the E ...

javascriptcssreactjsdraftjs

Equal dimensions for all cards in the TailwindCSS gallery display

I am currently working on an image gallery in React with Tailwind CSS. Here's a glimpse of how it looks: https://i.stack.imgur.com/ABdFo.png Each image component is structured like this: <div className="flex items-center"> < ...

htmlcssreactjstailwind-cssimage-gallery

Is it possible to conceal JavaScript comments on a page before it is displayed?

Curiosity has led me to ponder a question that may seem trivial. Consider this scenario: in my HTML or ASPX page, I include a comment for some JavaScript code. When the page loads, will the comments be rendered along with the rest of the page's conten ...

javascriptjqueryasp.nethtmlbrowser

The button attached to the jQuery .toggle() function requires two clicks to activate

My objective is twofold: To dynamically load the Disqus script embed.js only when the "Show Comments" button is clicked. To toggle the visibility of the disqus_thread div using the same button while also changing the button's text. The issue I am f ...

javascriptjquerytoggle

Vue Js and form-data Event: A deeper look into handling form

Hey there #Vue.js2 I'm facing an issue while trying to create a function that is called within a form submit event. This particular function needs both the EVENT and ID as parameters. The problem arises when I call this function, as I am unable to spe ...

javascriptformsvue.jsmultipartform-data

"Unlocking the Potential of ReactJS: A Guide to Setting Focus on Components Once They Become

My code had a <div> with a child component named SocialPostwithCSS, and when onClick was triggered, it would hide the div, set the state to editing: true, and display a <textarea>. I used this.textarea.focus with a ref={(input)=>{this.textar ...

javascriptreactjsfocus

"The controller's $scope isn't being updated within the DIV following a routing change

My website contains ng-view partials that change based on routing updates in $routeProvider. anmSite.config(function($routeProvider, $locationProvider){ $locationProvider.html5Mode(true); $routeProvider //Home page route .when("/", { temp ...

javascriptangularjsscopecontrollerroute-provider

Combining two containers in CSS

I am currently working on building a website design, and I have a menu positioned on the right side of the layout. Below is the code for the menu along with an explanation. #rightmenu { border-top: 1px solid #000000; border-right: 1px solid #00000 ...

csspositionpositioninghtml

What is the best way to format my JSON data as a table on the screen?

I need to display my data in a table format at the bottom of the screen, as shown in the screenshot below. Here is an example of the top part code: This code snippet is also used for movies. <View> <Text key={item.symbol}>{item.symbol}<Te ...

cssiosjsonreactjsreact-native

What is the best way to convert my query for use with MongoDB in a Node.js application?

Here is the structure of my MongoDB query: db.test.findOne({"User.David":{$elemMatch:{"action":"todo","status":"Done"}}}) I am currently developing a node.js API that allows users to retrieve documents based on username and status. Below is my attempt a ...

javascriptnode.jsmongodbmongoose

A step-by-step guide on leveraging ethereumjs-tx within a web browser

Is it necessary to install npm ethereumjs-tx when utilizing the browser-based version downloaded directly from GitHub? If so, how can we incorporate the ethereumjs-tx module into our script file? It seems like these are two separate components based on ...

javascriptnpmethereum