Wordpress problem with Bootstrap JavaScript code involving data-toggle="collapse"

Currently facing an issue with my project.

This is my first attempt at creating a WordPress blog, inspired by the HTML site www.humantools.com.mx and building a blog for it at www.humantools.com.mx/blog. There's a strange problem: when logged in, the navbar toggle with the class="navbar-toggle collapsed" data-toggle="collapse" works fine, both on the site and in the navbar...

However, when I log out, the nav item that should reveal the collapsed menu now links to "#".

This is really puzzling me, I'm struggling to figure it out, any help would be greatly appreciated. I've provided the CSS and header code below, let me know if you need anything else.


HEADER

<?php
          
  /**
  
  * The Header template for our theme
  
  *
  
  * Displays all of the <head> section and everything up till <div id="main">
  
  *
  
  * @package WordPress
  
  * @subpackage Twenty_Thirteen
  
  * @since Twenty Thirteen 1.0
  
  */
  
  ?>
  
  ... (header code continues)

CSS

/*
Theme Name:HumanTools.
Theme URI: www.humantools.com.mx
Description: Human Tools blog.
Version: 1.0
Author: Raul Salazar 
Author URI: www.bybrave.com
*/
... (CSS styles continue)

NAV STARTS

... (navigation styles continue)

NAV ENDS

/* blog */
... (blog styles continue)

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

Having trouble getting jQuery JavaScript to work on Wordpress and feeling lost about how to implement no-conflict mode syntax

Trying to implement the code from this Codepen http://codepen.io/eternalminerals/pen/qdGvMo on my WordPress website at I understand that since WordPress is in no-conflict mode, I need to change $ to jQuery. I have made this adjustment and ensured that the ...

Transform your data visualization with Highcharts enhanced with the stylish appearance of DHTML

I am currently using a dhtmlx menu with my charts, specifically the legendItemClick event. It worked perfectly when I was using highcharts 3.0.1. However, after upgrading to version 4.1.7, the function legendMenu_<?=$id?>.showContextMenu(x,y) in the ...

Error message encountered: "Forbidden - CSRF cookie is not set while attempting a POST request with Django

In my Django 3 application, I have implemented jQuery Ajax posts on bootstrap modals. There are several buttons that do not belong to any form but trigger a post request to specific URLs. All Django methods follow the guidelines mentioned here: https://do ...

Issue locating the prettyPhoto() function in ASP.net Jquery

I've been stuck on this issue for a while, so I thought I'd reach out to someone with more expertise. I'm working on a .NET website and trying to implement the prettyPhoto Jquery plugin. I have included the Jquery main library and the Pretty ...

The onProgress event of the XMLHttpRequest is triggered exclusively upon completion of the file upload

I have a situation with my AJAX code where the file upload progress is not being accurately tracked. The file uploads correctly to the server (node express), but the onProgress event is only triggered at the end of the upload when all bytes are downloaded, ...

Refreshing a single div with a variety of potential hyperlinks

My knowledge of jQuery is limited, but I recently discovered a code snippet that should allow me to refresh only a specific div on my webpage: <script> $(document).ready(function(){ $(".reload").click(function(){ $("#day").load("/some_url #da ...

Sorting functionality in Dyntable is not functioning properly when called from an Ajax request

I can't seem to get DynaTable with Ajax to work properly. Sorting, searching, and pagination are not functioning as expected. When I click on the column header, nothing changes in my table. Could someone please assist me? Below is my code snippet: H ...

Clicking the table initiates several AJAX operations to run using jQuery

As I searched for a solution to my problem, I reached a turning point where I could finally define the issue at hand. My code utilizes jQuery and Ajax, which are triggered by clicking on a table cell. The result is a table that I refresh at regular interva ...

Creating a multilingual website with Nextjs 13 App Router using internalization, all without the need

As I develop a web app that requires user authentication to access, I am currently using Next.js 13 with the App Route (not Pages Route). My goal is to implement internationalization without having to create sub-routes like /en, or use domains such as mywe ...

Can jQuery effortlessly glide downward, come to a stop, continue downward, and then move upwards?

My webpage features a large table created and populated automatically every minute using ajax. The code structure is as follows: $(document).ready(function(){ setInterval(function(){ $.ajax({ //code to call backend, get the data, ...

Displaying Response After Making an Ajax Request

How can I display the results of an echo from action.php back on index.php while executing the script in AJAX? For example, index.php calls action.php (AJAX) and once it is successful, action.php will echo some text. How do I display this text on index.ph ...

Storing div content in database directly

I have a straightforward div that allows users to edit content on the page. I need to save this content in a database, but without including any HTML tags while still preserving line breaks. Currently, I am using the innerText property for this purpose. N ...

Issue with loading CSS and JavaScript following a GET request

I initially used express and the render function to display different pages on my website. However, I've now decided to switch to vanilla JavaScript instead. The objective is to load the HTML file along with all the necessary JS and CSS files. Below i ...

Definitions for TypeScript related to the restivus.d.ts file

If you're looking for the TypeScript definition I mentioned, you can find it here. I've been working with a Meteor package called restivus. When using it, you simply instantiate the constructor like this: var Api = new Restivus({ useDefaultA ...

What are the steps for encountering a duplicate property error in TypeScript?

I'm currently working with typescript version 4.9.5 and I am interested in using an enum as keys for an object. Here is an example: enum TestEnum { value1 = 'value1', value2 = 'value2', } const variable: {[key in TestEnum]: nu ...

Can Socket.IO link to a source tag that doesn't actually exist?

As I was following the 'Get started thing' tutorial on Socket.IO, I encountered a step that required me to add the socket.io.js script to my HTML page. The instruction provided was: /socket.io/socket.io.js However, when I checked my folders, I ...

Generating symbols that combine both images and text seamlessly

I am working with a circle image that I need to resize based on its placement. This image is intended to be a background for a character or two of text. Specifically, whenever the number 1 or 2 appears in a certain element, I want the circle to appear beh ...

Is there a way to restrict the selection of new tags in jQuery select2 plugin when a valid value from the ajax call is already present in the list?

I am currently utilizing select2 version 4 for multiple select functionality. I have enabled the option for users to add new tags, but I want to restrict them from choosing a tag that already exists in my backend database. At present, when a user inputs a ...

Ways to Retrieve the Text From the Selected Index in Datalist Element

I need to extract the inner text of the option tag using pure JavaScript This is the HTML code I am working with: <input list="in" name="i_n" class="form-control" placeholder="Enter Item Name" required> <datalist id="in" onChange="rate(this)"&g ...

What reasons could explain why the more efficient approach of offering an initial portion of data is not faster in practice?

My website contains numerous pages with a plethora of small images that need to be loaded. To enhance user experience, I devised two methods to first display a subset of the content without waiting for the entire page to load. The data is stored in a .json ...