SIngle picture homepage

There is a lot of ways to do it…

As far as I understood, you want to use an image as background, as simple as that, right? If that is the case, for you to have an idea, that site you showed us used a very thin line as background (https://www.rhonegroup.com/images/rh_bg_1px.gif) and then made it repeat verticaly (repeat-y). To see the background image, you right-click on the image and choose “show background image” or something like this, and you will see the thin line image. He picked a background with gradient and croped it that size.

OK, that was just one explanation apart. Sorry if am teaching something that you already know.

I will try to help you with one method I used to have a simple page with a background image.

Go to your panel and install the theme: ARCADE (The one that has the bike).

After that, right-click on the section you don’t want to appear and choose “inspect element (Q)”. On right side, try to put the following code:

display:none !important;

You will notice that that section will disappear. Copy that specific snippet of code, go to appearance > editor and paste the code in the very bottom, in order to find it easier later on. Save it… Do it step by step, eliminating what you don’t whant. Just leave the header with the background image and change it on appearance > customize…

Do at least the beginning of it and post here the url of your website and I’ll help you reach the result you want, ok?

Elis:

Thanks sooo much for your help. I’m really lost here, thanks for the explanation as well.

I followed your instructions, however so far all I managed is to have the theme installed, here you can see my website:

https://gbenterpriser.com/

However I have no clue onhow/where to get rid of eeeeveything there that is strictly not the bike picture: “See more” button, all the forms at the bottom. It seems this wants to force me to have some sort of blog (which I don’t!)

so.. yes, the more detail, the better!

Thanks!!!

This is a very simple page I did with this Arcade theme: https://elisandroborges.com.br/espacoflora/

Do you want something like that? Just to show an image and maybe some simple information?

Without the contact form…

Elisandborges:

Exactly! That’s what I need! ?? Nice page btw

Great! So, let’s build it together.

Go to appearance > Editor and paste the code below in the bottom and save it. Let’s see if only the bike is left:

.navbar-inverse {
text-align: left;
background: rgba(0, 0, 0, 0.6) none repeat scroll 0% 0%;
border: 0px none;
display: none !important;
}

.row {
margin-left: -20px;
margin-right: -20px;
display: none !important;
}

#page {
overflow: hidden;
margin-bottom: -20px !important;
}

.only-on-home #site-meta i, .only-on-home #site-description, .only-on-home #more-site {
animation: 1s ease-in 0s normal none 1 running fadeHeader;
display: none !important;
}

#site-title a {
color: #FFF;
text-decoration: none;
display: block !important;
width: 100%;
display: none !important;
}

#footer #footer-content {
padding-top: 15px;
padding-bottom: 15px;
margin-bottom: -33px !important;
}

#footer {
border-top: 1px solid #000;
background: #222 none repeat scroll 0% 0%;
color: #7B7B7B;
font-size: 13px;
position: relative;
z-index: 100;
clear: both;
padding: 0 !important;
}

elisandroborges this starts to look a LOT better now!!!

Could I have instead of the picture that pattern you found from the sample website I showed you? https://www.rhonegroup.com/images/rh_bg_1px.gif and then just a small text box to type in my company name ??

Thank you so much for your help!!

The sky is the limit, my friend. Just imagine what you want, and be sure it is possible to achieve.

For the background as a pattern, firt make the image you wanna use, let’s use this as an example, because I don’t Know if the people in charge of this website will be happy to see that you are using their background: https://www.rhonegroup.com/images/rh_bg_1px.gif. Download it to your computer first.

Go to Appearance > Customize > Background Image (Upload the image) and choose “repeat vertically”. Save it. You will have the same background.

Do it, and we will move to the next step.

Done!!!

Agree, will change patter, I just needed to learn how to place one. I will pick another soon.

Now we can proceed with inserting a text box. I have a very short text. and a small logo.

??

Now, go to Appearance > Editor > (on your right hand side) click on “header.php”.

Delete the whole code, leave it blank and paste this one below. To find where you will place your text, use ctrl or cmd(if mac) + F and type “my text”. Replace it with your text. To place your logo, it’s right above <img src=”mylogourl.jpg”/>. Paste the url of your logo in quotes, replace only this: mylogourl.jpg with you url.

Here is the code:

<?php
/**
* The Header for our theme.
*
* Displays all of the <head> section and everything up till <main>
* and the left sidebar conditional
*
* @since 1.0.0
*/
?><!DOCTYPE html>
<!–[if lt IE 7]><html class=”no-js lt-ie9 lt-ie8 lt-ie7″ <?php language_attributes(); ?>><![endif]–>
<!–[if IE 7]><html class=”no-js lt-ie9 lt-ie8″ <?php language_attributes(); ?>><![endif]–>
<!–[if IE 8]><html class=”no-js lt-ie9″ <?php language_attributes(); ?>><![endif]–>
<!–[if gt IE 8]><!–><html class=”no-js” <?php language_attributes(); ?>><!–<![endif]–>
<head>
<meta charset=”<?php bloginfo( ‘charset’ ); ?>”>
<meta name=”viewport” content=”width=device-width”>
<meta name=’revisit-after’ content=’3days’/>
<meta name=”rating” content=”General” />
<meta name=”robots” content=”index, follow” />
<link rel=”profile” href=”https://gmpg.org/xfn/11″&gt;
<link rel=”pingback” href=”<?php bloginfo( ‘pingback_url’ ); ?>”>
<!–[if IE]><script src=”<?php echo BAVOTASAN_THEME_URL; ?>/library/js/html5.js”></script><![endif]–>
<?php wp_head(); ?>
</head>
<?php
$bavotasan_theme_options = bavotasan_theme_options();
$space_class = ”;
?>
<body <?php body_class(); ?>>

<div id=”page”>

<header id=”header”>
<nav id=”site-navigation” class=”navbar navbar-inverse navbar-fixed-top” role=”navigation”>
<h3 class=”sr-only”><?php _e( ‘Main menu’, ‘arcade’ ); ?></h3>
“><?php _e( ‘Skip to content’, ‘arcade’ ); ?>

<div class=”navbar-header”>
<button type=”button” class=”navbar-toggle” data-toggle=”collapse” data-target=”.navbar-collapse”>
<span class=”icon-bar”></span>
<span class=”icon-bar”></span>
<span class=”icon-bar”></span>
</button>
</div>

<div class=”collapse navbar-collapse”>
<?php
$menu_class = ( is_rtl() ) ? ‘ navbar-right’ : ”;
wp_nav_menu( array( ‘theme_location’ => ‘primary’, ‘container’ => ”, ‘menu_class’ => ‘nav navbar-nav’ . $menu_class, ‘fallback_cb’ => ‘bavotasan_default_menu’ ) );
?>
</div>
</nav><!– #site-navigation –>

<div class=”title-card-wrapper”>
<div class=”title-card”>
<div id=”site-meta”>
<h1 id=”site-title”>

<div style=”padding:20px;float:left; width:320px;”>

<center><img src=”mylogourl.jpg”/></center>

My text goes here…

</div>

</h1>

<?php if ( $bavotasan_theme_options[‘header_icon’] ) { ?>
<i class=”fa <?php echo $bavotasan_theme_options[‘header_icon’]; ?>”></i>
<?php } else {
$space_class = ‘ class=”margin-top”‘;
} ?>

<h2 id=”site-description”<?php echo $space_class; ?>>
<?php bloginfo( ‘description’ ); ?>
</h2>
<?php
/**
* You can overwrite the defeault ‘See More’ text by defining the ‘BAVOTASAN_SEE_MORE’
* constant in your child theme’s function.php file.
*/
if ( ! defined( ‘BAVOTASAN_SEE_MORE’ ) )
define( ‘BAVOTASAN_SEE_MORE’, __( ‘See More’, ‘arcade’ ) );
?>
<?php echo BAVOTASAN_SEE_MORE; ?>
</div>

<?php
// Header image section
bavotasan_header_images();
?>
</div>
</div>

</header>

<main>

gbenterpriser

This has been awesome. I know understand the variables in order to modify everything I need.

I really want to thankyou for helping me. I’m an accountant, you should feel very proud of being able to teach someone just through forum posts!

Thanks a L O T!!!

Regards,

Hello, my friend.

I feel very happy that you reached your goal.

There is only one tiny thing to do: You need to center you text.

Go to your text and do like this: <center>Growing Brands</center>

And then, it will be perfect!

If you need help and nobody answers, you can call me here: [email protected].

Best Regards from Brazil!

Elisandro.

Just for the record: Beautiful logo you have!

If you want to learn those things, search for tutorials in the following topics:

* HTML (Ps.: the basic markup);
* CSS; (Ps.: the beautiful magic);
* PHOTOSHOP (Ps.: for manipulation and treatment of images…)

And if you need help, I’m here and here [email protected]

Don’t forget to center you text:

<center>Growing Brands</center>

=)