hash in url does not load different page - html

In my nav I have a link to View Profile, Edit Profile and a link to My Projects. The url structure looks like this:
/users/username <-- View Profile
/users/username/edit <-- Edit Profile
/users/username/edit#my-projects <-- My Projects
My href links are those exactly, now if I am on my homepage or any other page besides /users/ it will open Edit Profile and then My Projects tab on that page when you click the My Projects link in the nav. However, if you have clicked View Profile first and then click My Projects it will just append the hash #my-projects to the end of the current url /users/username#my-projects instead of going to /users/username/edit#my-projects.
Is there something I am missing when linking to another page and having a hash at the end of the link?
********UPDATE********
<ul class="dropdown-menu pull-right">
<li>View Profile</li>
<li>Edit Profile</li>
<hr>
<li>My Projects</li>
<hr>
<li>Log out</li>
</ul>
I don't think this will help, but I am using zf2 if that changes how routing works or not.
Unfortunately, I do not have an example outside of local and production.

Related

The home page translation link is static and is not used to translate all pages

I have a problem I hope to solve it as I display in the navbar languages ​​used in the site and I want whenever you click on the language the page appears with the translation in all pages and not only the main page ,with the translation link changes with each page
http://127.0.0.1:8000/fr/
http://127.0.0.1:8000/fr/our-company
So add on the home page link.
How to fixed the link on the home page so that the translation is displayed for all pages and keep on the same page translated
Navbar home page in all pages
<ul class="navigation__dropdown-wrap--language">
<li>
<a data-culture="ar" data-lang="True" href="/">العربية</a>
</li>
<hr>
<li>
<a data-culture="en" data-lang="True" href="/en/" lang="en">English</a>
</li>
<hr>
<li>
<a data-culture="fr" data-lang="True" href="/fr/" lang="fr">français</a>
</li>
<hr>
</ul>
Try looking into Django's i18n package. It comes with full support for translations, timezones and locales. (Numbers and dateformats).
The package comes with support for internationalized URLs.

URL/Domain remains when clicking on the subpages - WORDPRESS

I'm using wordpress for my website.
I entered the href links on the widgets footer but its not working properly only at the homepage.
Can you help me with my website?
The link at the footer section "services" is not working it is like duplicates the url and it will not refresh or go to the link I entered.
In homepage, the link is working but the other footer page doesn't work. [Here is the link][1].
On different sections the links set have different URLs.
For example the Custom Apparel one when accessed from the home page has - https://opti-advertising.com/offer/#custom link, while if accessed from Contact page it redirects to https://opti-advertising.com/contact/www.opti-advertising.com/offer/?page_id=20#custom.
CODE:
<ul style="line-height: 32px;">
<li><i style="color: #ff0084;" class="icon-layout"></i> Online Advertising Services</li>
<li><i style="color: #ff0084;" class="icon-layout"></i> Digital & Offset Printing Services</li>
<li><i style="color: #ff0084;" class="icon-layout"></i>
Custom Apparel</li>
<li><i style="color: #ff0084;" class="icon-layout"></i>
Traditional Advertising Services
</li>
<li><i style="color: #ff0084;" class="icon-layout"></i>
Marketing Giveaways
</li>
</ul>
You are just hardcoding the links in your footer, e.g. placing links to the footer like this:
Link
When you access this link from homepage, CMS serves it from the root of your site, and you get the right address:
www.opti-advertising.com/offer/?page_id=20#printing
But if you click this link from any secondary page, you will get the address like this:
www.opti-advertising.com/page/www.opti-advertising.com/offer/?page_id=20#printing
because CMS serves the link from current page, which has path of
www.opti-advertising.com/page/
To solve this, you should at least remove domain name from the url and prepend a slash to it:
Link
But the best approach – is to do things right – generate links dynamically. Wordpress gives you some snippets, for example
site_url();
With this you can do things like:
Link
which will on any page output this:
https://www.opti-advertising.com/offer/?page_id=20#printing

How to check if urls is already open HTML

I was working on a mini website project using django. I found bootstrap a while ago and started using some of their features. One that I really liked was the dropdown button.
<li class="dropdown">
Dropdown <span class="caret"></span>
<ul class="dropdown-menu">
<li>Home</li>
<li>Blog</li>
<li>Contact me</li>
</ul>
</li>
But I was having a unexpected "error"/bug. When I click on one of those buttons it will add its href to the url.
And here comes the problem. It will add the href even if the url already contains it. How can I solve this problem and where. On django scripts or with javascript?
The Problem
It looks to me like everything is behaving as it should technically, the problem is with the href target itself.
Since you have a relative link not an absolute one, it assumes it target is relative to the page you are on.
Potential Solutions
1 - Use an absolute link in this case.
<li class="dropdown">
Dropdown <span class="caret"></span>
<ul class="dropdown-menu">
<li>Home</li>
<li>Blog</li>
<li>Contact me</li>
</ul>
</li>
2 - Use the base tag.
This will set a root url for your website, it may cause unexpected results so check and re-check if you use this solution.
HTML Base Tag

Change links from scrolling on same page to pointing to different pages

I am modifying a site that has a menu with the following code:
<h3>Menu</h3>
<ul class="nav">
<li><a data-scroll href="#home">Home</a></li>
<li><a data-scroll href="#services">Service</a></li>
<li><a data-scroll href="#contact">Contact</a></li>
</ul>
As a user clicks on those links the user will be taken to the corresponding section on that page.
I need to modify this to allow for links that do not point to the same page.
I tried the obvious:
<h3>Menu</h3>
<ul class="nav">
<li>Google</li>
</ul>
but it won't work.
The status bar shows the correct link but when I click the page won't change.
Is there any special code I need to add (links on other places of the page work fine).
As we discussed, Javascript (specifically jQuery preventDefault) can override the default behavior of an anchor (that is to say, follow it). Therefore, check all Javascript for this situation.
Also, a link MUST have an http:// in front of it, to define the resource type. Links only work on the same page or domain if there isn't one.
It is clear to me that
Google
Will not work because you should write it like so:
Google
Give that a try, if the answer is not this, then you should share with us what else you are doing on your site that we cannot simply imagine by the snippet you have shared with us.

What does class="active" really do in bootstrap 3?

I am learning twitter bootstrap 3 these days.
There is a class called "active" in bootstrap. I have seen this feature even in CSS. As I know it indicates the active page or link (probably it is the page that we are currently in). Please correct me if I am wrong. What I need to know is why we need to call such a class in our mark-up. Because it is upto the user to decide which page that he needs to be in.
If I explain this further below mark-up has used class="active" in the 2nd list element. (i.e Profile). When I run the code in a browser it adds a nice blue background to Profile. Why should I add such a class? Active tabs vary when users navigate from one tab to another. Is not it?
<div class="container">
<div class="row">
<nav>
<ul class="nav nav-pills nav-justified">
<li>Dashboard</li>
<li class="active">Profile</li>
<li>Earnings</li>
<li>Settings</li>
</ul>
</nav>
</div>
</div>
With 4 pages in your Navigation, the .active class should be on each different list item from #1 to #4 depending on the page you're in. Below are 4 excerpts for each 4 pages.
Breadcrumbs.html:
<ul class="nav nav-pills nav-justified">
<li class="active">Dashboard</li>
<li>Profile</li>
<li>Earnings</li>
<li>Settings</li>
</ul>
Jumbotron.html:
<ul class="nav nav-pills nav-justified">
<li>Dashboard</li>
<li class="active">Profile</li>
<li>Earnings</li>
<li>Settings</li>
</ul>
FavoutieActors.html:
<ul class="nav nav-pills nav-justified">
<li>Dashboard</li>
<li>Profile</li>
<li class="active">Earnings</li>
<li>Settings</li>
</ul>
Breadcrumbs.html:
<ul class="nav nav-pills nav-justified">
<li>Dashboard</li>
<li>Profile</li>
<li>Earnings</li>
<li class="active">Settings</li>
</ul>
The active class is applied to the navigation element the user is currently viewing.
In the case of your given code, the user is viewing the the profile. It will serve as a guide or reminder to where in the website the visitor is in. That is why the active class is applied, which comes handy when viewing a website with many navigation links.
You can dynamically add the active class to whichever element is active. You can either do this as your page is rendered. Or via JavaScript, if you wish to change the active element without posting back to the server.
From your example, by adding the active class to your 'Profile' item, it should render the item in a way that suggests visually that this is the current item or page you're viewing.
What I need to know is why we need to call such a class in our mark-up. Because it is upto the user to decide which page that he needs to be in.
The user decide what page and the designer and developer decide how its button look while the user on it. The active class can do more than it's just a markup in your page. It could be used to add different look and feel, color effects etc.
Why should I add such a class? Active tabs vary when users navigate from one tab to another. Is not it?
You are not required to add and manage in many usual cases but sometimes you might need. From design point of view, it tells the user that he/she is now here, from programming point of view that class could be used in different ways to assign unique action for that button or other button and not for it.
The same thing for first and last classes we usually add, they allow us to do different scenarios or CSS proprieties for these buttons and/or elements.
Class="active" is usually used to highlight any active content from a selection, mostly in navigation. Let's say in a website with different page links on navigation, just to indicate that the user is on this page, active class highlights that link increasing the usability of navigation.