Issue with font selection on WordPress menu settingsI am having trouble getting my

Could someone please take a look at this? I am struggling to figure it out on my own. I am currently working on a website for a client and I have created a responsive menu.

Unfortunately, the font style for the menu isn't working even though I have specified it as important.

The URL for the website is:

The style I am trying to implement is called Cocktail Shaker.

I really need some help as my client is in a rush and I only have half an hour left to fix this issue. I have been trying to solve it since this morning.

Thank you in advance.

csswordpress

Answer №1

Unfortunately, the font you are attempting to retrieve from Google Fonts is no longer available. The URL is invalid and won't work.

Consider downloading the font and hosting it on your server instead. This should solve the issue :)

Answer №2

Your css code is currently using 'sagar_menu' as the font-family name, when it should be 'Cocktail Shaker'. Make sure to update your css to reflect this change:

.navbar {
    font-family: Cocktail Shaker;
}

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

What are some ways to customize the appearance of React Semantic components?

Is there a way to apply CSS for react semantic UI when using create react app? I have installed semantic-ui-react and included the CSS CDN: loginForm.js: import React from "react"; import { Button, Form, Header } from "semantic-ui-react"; import styles f ...

javascriptcssreactjs

When hovering over various div elements in HTML

I've been experimenting with some code lately, and I'm trying to change the text color of a menu element when hovering over it. I can alter the background color just fine, but for some reason, the text color remains unchanged. Can anyone offer a ...

javascripthtmlcss

Is there a way to use Jquery to determine if a parent div contains a scroll

I'm trying to find a jQuery example that checks if any parent div has a scroll bar, but I can't seem to locate a helpful one. Here is the code snippet I am working with: <div> <div class="heading"> <div class="visit ...

javascriptjqueryhtmlcss

Issue encountered while attempting to include a background image in React JS

I encountered an issue when attempting to include a background image in react js. ./src/index.css (./node_modules/css-loader/dist/cjs.js??ref--5-oneOf-4-1!./node_modules/postcss-loader/src??postcss!./src/index.css) Unable to locate module: An attem ...

javascripthtmlcssnode.jsreactjs

Leveraging WordPress as a landing page integrated with a Silverlight backend

Currently, I am a web developer working on a project for a WordPress landing page that will eventually direct users to an all-Silverlight page. However, my programmer is claiming that this cannot be accomplished due to conflicts between PHP and Silverlight ...

phpasp.nethtmlsilverlightwordpress

I'm not sure if I'm doing this right, the image seems to be overlapping the border

Just dipping my toes into the world of HTML/CSS, so feel free to point out any major errors in my code. The issue I'm facing is illustrated in this image (Apologies for the black boxes covering up some content; focus is on the top image). Check out ...

htmlcssimageborder

Opacity problem when hovering on Chrome

Work in progress: Hello everyone, I'm facing an issue with a hover effect that only seems to be occurring in Chrome. When hovering over a tile, the background color changes, the image opacity decreases, and an icon appears over the image. In Chro ...

htmlcsshoveropacity

Track the number of downloads for individual items independently, regardless of language

I'm in the process of creating a download counter for each "Book" on my website. One thing to note is that some books have downloads available in different languages. My goal is to have a system where if a book has only one download, the counter inc ...

phpjquerymysqlajaxwordpress

Using flags to translate text on Google should not result in being redirected to another website

I have integrated Google's language picker with country flags into my WordPress template using the code below: <!-- Add English to Chinese (Simplified) BETA --> <a target="_blank" rel="nofollow" onclick="window.open('http://www.google. ...

javascriptjquerywordpressgoogle-translategoogle-translator-toolkit

Styling targeted to a particular div

Currently, I am attempting to showcase a docx file on my webpage by converting it to HTML and then displaying it. However, this method generates CSS with rules that end up impacting the entire document. For instance, it changes all links to blue which co ...

htmlcss

Update: "Mui V5 - Eliminate collapse/expand icons in TreeView and reduce TreeItem indentation"

My current project involves Mui V5 and I am looking to customize the TreeView component. Specifically, I need to remove the collapse/expand icons as I want them to be integrated into the TreeItem label component on the left side instead of the right. Add ...

javascriptcssreactjsmaterial-uitreeview

Arranging elements within a div using inline positioning

Currently, I am trying to arrange elements within a div. Below is the div that needs positioning: https://i.sstatic.net/5nZUt.jpg This is the desired layout: https://i.sstatic.net/vXSV9.jpg Here is the HTML and CSS code snippet: #channel-header * { ...

htmlcsselement

Unusual CSS media queries behavior

During my project work, I faced a puzzling issue which can be illustrated with the following example: Here is the sample CSS code: *, *::after, *::before { box-sizing: border-box; margin: 0; border: 0; } @media only screen and (max-width ...

htmlcssmedia-queries

If the element is checked and equal to a specific value, take action

I am trying to hide one of the 3 radio buttons on my page. Although they all have the same class, each button has a different value. I attempted to write code to achieve this, but unfortunately, it is hiding all radio buttons instead of just one. Could s ...

javascriptjqueryhtmlcss

Div element obstructing the ability to view markers

Issue with a positioned DIV over Google Maps: The DIV is causing accessibility problems for the map, taking up the entire width when it should stop at the green square borders. Interaction with the map is limited to the very bottom after the green square. ...

htmlcssgoogle-maps

Ensuring the input element is correctly aligned in its position

How can I center the input element inside its parent without any top margin? What CSS changes do I need to make? #menu { height:30px; background: #ccc; } #board-name { display:block; margin-left:auto; margin-right:auto; height: 80%; vertical-al ...

htmlcssinputposition

Changing the order on mobile devices in Bootstrap 4: A quick guide

Currently, I am working on a responsive layout using Bootstrap 4 with two columns. Each column contains a total of 9 divs - four in the first column and five in the second column. My goal is to rearrange the order of the divs within the columns when the vi ...

htmlcssbootstrap-4

The alignment of the HTML and CSS speech bubble is experiencing issues

I need help with CSS as I am new to it and trying to create a speech bubble. However, when the text inside the bubble is long, it overlaps the timestamp. I am currently using `display: inline-block;` in my CSS. Below are snippets of my HTML and CSS code: ...

htmlcss

How can you incorporate a custom button into the controlBar on videoJS in responsive mode?

The video player I have created using videoJS includes custom buttons in the control bar. These buttons are not clickable when viewed on mobile or tablet devices without forcing them to work. let myButton = player?.controlBar.addChild('button'); ...

javascripthtmlcssnext.jsvideo.js

Discover which students have conflicting schedules with themselves

To put it simply, my question involves a table display where student numbers (USN) are concatenated in groups and the entire row is displayed using a foreach loop. Row 1: Subject 1 - 22/07/2015 - 08:00 - 1XX10XX086, 1XX10XX087, 1XX09XX088 Row 2: Subject ...

phpjqueryhtmlmysqlcss