Having trouble updating the icon on my website using FontAwsome

Just a heads up - I'm not familiar with HTML/CSS/JS. This template is pre-made, and I'm simply making some adjustments to it.

Hello, I'm currently working on my portfolio website and I want to display my projects based on the programming language they were written in. For R projects, I'd like to use an R icon, and for Python projects, a Python icon. When using the fa-python icon, all I see is a white circle. Here is the code along with an image:

<span class="icon solid major fa-code" ></span>

Image for the first code: https://i.stack.imgur.com/TIQFW.png

This is what I'm attempting to achieve:

<span class="icon solid major fa-python" ></span>

Image: https://i.stack.imgur.com/xY9aq.png

javascripthtmlcssfont-awesome

Answer №1

Check out these helpful examples:

<i class="fab fa-html5"></i>

<i class="fab fa-css3"></i>

When implementing the code above, remember to include 'fab' before the icon name like 'fab fa-css3'

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

Clicking on an element in React Material UI Autocomplete will bring it

I'm currently working with a material-ui autocomplete element <Autocomplete id="combo-box-demo" autoHighlight openOnFocus autoComplete options={this.state.products} getOptionLabel={option => option.productName} style={{ width: 300 ...

javascriptreactjsautocompletematerial-ui

Guide to configuring browserify

After installing the modules (browserify, react, reactify), I attempted to process a JSX file using browserify. var React = require("react"); var App = React.createClass({ render: function () { return <h1>111</h1> } }); React ...

javascriptreactjsnpmpreprocessor

The command "bin" is not identified as an internal or external command in this npm script

I'm new to using node/npm and encountering an issue when attempting to start an npm script. Every time I try to execute a simple script like the one below, I get the error message "bin is not recognized as an internal or external command." I have suc ...

javascriptnpmbin

Is there a way to achieve a double background color effect in CSS while ensuring that the text is centered within the second background color element?

How can I achieve a layout similar to the one shown in this image: ul menu li tags Should I use two tags for each element? Here is an example: <ul class="menu"> <div class="outside"><li class="inside"><a href="#">Firefox</a ...

htmlcsshtml-listsmenuitem

Troubles arise when trying to encapsulate a ReactJS embedded application with Material ui, causing issues with the

Currently, I am integrating a ReactJS application using Material UI styled components within a Wordpress page. To achieve this, I am utilizing webpack for transpilation of the JavaScript. After generating the bundle for the embedded version of the applica ...

cssreactjswordpressmaterial-uiembed

How can you obtain values from a nested JSON object and combine them together?

I have a javascript object that is structured in the following format. My goal is to combine the Name and Status values for each block and then store them in an array. { "datatype": "local", "data": [ { "Name": "John", ...

javascriptjqueryjson

What is the best way to obtain the output produced by a function when a button is clicked

When I click on a button, the desired action is to trigger a function that adds a new property inside an object within a large array of multiple objects. This function then eventually returns a new array. How can I access and utilize this new array? I am ...

javascriptreactjsfunctionusecallback

Troubleshooting regex validation issues in a JSFiddle form

Link to JSFiddle I encountered an issue with JSFiddle and I am having trouble figuring out the root cause. My aim is to validate an input using a regex pattern for a person's name. $("document").ready(function() { function validateForm() { var ...

javascriptjqueryhtmlcssjsfiddle

URL from different domains

Currently, I am attempting to utilize this URL within my javascript code: Below is the snippet of my javascript code: $.ajax({ url: 'http://api.addressify.com.au/address/autoComplete', type: 'GET', crossDomain ...

javascriptajax

What is the process for sending text messages in a local dialect using node.js?

Having an issue with sending bulk SMS using the textlocal.in API. Whenever I try to type a message in a regional language, it displays an error: {"errors":[{"code":204,"message":"Invalid message content"}],"status":"failure"} Is there a workaround for se ...

javascriptnode.js

Using JSON to insert an array into an object with identical key name

var arr = ['1', '2', '3'] var part = {} var partContents = [] arr.map(function(i){ partContents.push({ obj: i }) part['text'] = partContents }) console.log(part); Is there a way to create separate arrays with ...

javascriptjson

Personalize the tooltip feature in highchart

I am looking to enhance the tooltip feature in HighChart. Currently, on hover of my bar chart, only one value is displayed in the tooltip. However, I would like to display three values instead. Here is a snippet of my code: $(function () { $( ...

jqueryhtmlhighchartsbar-chart

Looking to remove a task from an array of objects with the help of Sequelize?

I am facing an issue with updating my task array in the database using Sequelize. Despite finding the index of the task to be deleted and updating the tasks array, the changes are not reflected in the database. Below is my code snippet: var idx = 0; for ...

javascriptnode.jspostgresqlsequelize.js

What is the best way to implement filter functionality for individual columns in an Angular material table using ngFor?

I am using ngFor to populate my column names and corresponding data in Angular. How can I implement a separate filter row for each column in an Angular Material table? This filter row should appear below the header row, which displays the different column ...

javascriptangulartypescriptangular-materialmaterial-ui

What is the best way to transmit a two-dimensional array using ajax?

Here is the process I use to send data to the server: var points = []; var coords = polyline.geometry.getCoordinates(); for (var i = 0; i < coords.length; i++) { var x = (coords[i][0]).toFixed(4); var y = (coords[i][1]).toFixed(4); points[i ...

phpjavascriptajaxarrays

Reverting back to PDF using jQuery

I am currently utilizing jQuery to send JSON data back to the server, which in turn generates a PDF report. However, I am facing an issue where the PDF is not downloading despite specifying the necessary response header and including JavaScript as shown ...

javascriptjqueryajaxasp.net-mvc

Retrieve the input field's value with Selenium, verify its accuracy, and proceed to log a message to the console

Hey there! I'm facing a challenge while working with Selenium Webdriver, specifically Chrome Webdriver and writing tests in JavaScript. The problem is in a section of the code where I can't seem to grab the value typed into an input field using t ...

javascriptnode.jsseleniumselenium-webdriverselenium-chromedriver

Utilizing Node and Electron to dynamically adjust CSS style properties

Having a dilemma here: I need to access the CSS properties from styles.css within Electron. Trying to use document.getElementsByClassName() won't work because Node doesn't have document. The goal is to change the color of a specific div when the ...

javascriptcssnode.jselectron

Strange Actions with JQuery Drag-and-Drop Functionality

Apologies for my limited experience with JQuery UI, but I am in the process of creating a web-based chess engine for 2 players using JavaScript. Instead of point and click, I have decided to implement a user-friendly drag and drop feature for non-mobile us ...

javascriptjqueryjquery-uijquery-ui-draggablejquery-ui-droppable

Interactive text animation triggered by a click

jQuery ( function ( $ ) { console.log(">>Testing animation"); $('a.loveit').on('click',function(event){ event.preventDefault(); var text = $(this).find('div.love-text'); ...

jquerycss