Copy link to clipboard
Copied
I want to add an image to my heading at the top of the home page, but how do I do that? Please help.
This is where I want to add it to.
You should use real text for search engines, language translators and screen readers. Images of text especially in the background cannot be indexed. Feel free to use a Google or Typekit web font to dress it up a little.
Here's a working example of a Goggle web font styled with CSS.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Example Header</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--G
...Copy link to clipboard
Copied
Not sure of what you are having a problem with? Just add it like you would any other image on your site. Maybe elaborate a bit more on where you are stuck.
Copy link to clipboard
Copied
Adding a background image to the heading of the page. Instead of using color, use an image. I want to add a background image to that heading I shared.
Copy link to clipboard
Copied
You should use real text for search engines, language translators and screen readers. Images of text especially in the background cannot be indexed. Feel free to use a Google or Typekit web font to dress it up a little.
Here's a working example of a Goggle web font styled with CSS.
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Example Header</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--Google Web Font-->
<link href="https://fonts.googleapis.com/css?family=Bungee+Shade&display=swap" rel="stylesheet">
<style>
body { margin: 0;}
header {
margin: 0;
padding: 1%;
background: navy;
color: white;
}
header h1 {
text-align: center;
border: 4px double white;
border-left:none;
border-right:none;
font-family: 'Bungee Shade', cursive;
line-height:1.5;
}
</style>
</head>
<body>
<header>
<h1>My Awesome Website</h1>
</header>
</body>
</html>
Copy link to clipboard
Copied
So you're saying there is no way to add a background image?
Copy link to clipboard
Copied
No I'm not saying you cannot use a background-image. I'm saying a background-image used this way is not ideal for lots of reasons. Real text is better. To understand why, read the Google SEO Starter Guide. It's best you learn about this now than after it's too late.
Search Engine Optimization (SEO) Starter Guide - Search Console Help
header {
margin: 0;
padding: 1%;
background: navy url("https://placeimg.com/1200/200/nature") no-repeat;
color: white;
}
Copy link to clipboard
Copied
The generic way to add an image in DW is to go to Insert > Image or Ctrl + Alt + i.
Choose an image from your site folder and hit OK.
For more specific instructions, we would need to see your code.