top menu header customisation – get rid of search bar

Hi Laura,

Put this CSS into your custom css or child theme style.css so that you won’t lose the changes when the theme updates. Child themes are the safest way when doing all kinds of modifications.

.header-form {
    display: none;
}

I hope this helps!

– Luke

Hi Laura,

To answer your second question:

There is a great plugin called ‘Social Media Widget’

1. Go to Plugins –> Add New
2. Search for ‘Social Media Widget’
3. Click on ‘Install Now’
4. After install is complete click on ‘Activate Plugin’.

5. Now go to Appearance –> Widgets
6. Click on ‘Social Media Widget’
7. Click on ‘Add Widget’

8. Scroll down a little and you’ll see a few pull down menu’s like
‘Social Networking’, ‘Images and Video’ etc.

9. Click on your preference and add your URL.

10. When you are finished scroll right down to the bottom and click ‘Save’.

I hope that gets your started! ??

– Luke

That is so helpful! Thank you – now I know I sound like a total noob, but how do I first access my CSS for my home page? I am super new to this

You can ‘access’ your CSS by going to:

Appearance -> Editor -> Stylesheet (style.css)

However, any code you paste or change here will be overridden when the theme updates.

The most recommended option for custom code is to create a child theme.

A child theme allows you to add only your customizations to the style.css file and remains effective even when you update your theme.

To create a child theme you can read about it here:

https://codex.www.ads-software.com/Child_Themes

The basic steps are :

1. Navigate to the directory wp-content/themes/
(Using an ftp client or File Manager in Cpanel)

2. Create a new folder called ‘adelle-child’

3. Create a new file in that directory called style.css and paste in this code:

/*
 Theme Name:   Adelle Child
 Theme URI:    https://example.com/adelle-child/
 Description:  Adelle Child Theme
 Author:       Laura
 Author URI:   https://www.lauralovesbeautyblog.com
 Template:     Adelle
 Version:      1.0.0

*/

@import url("../adelle/style.css");

/* =Theme customization starts here
-------------------------------------------------------------- */

/* Remove Search Bar*/
.header-form {
    display: none;
}

4. Now you have to activate the child theme in your WordPress Admin area:

Appearance – > Themes – > Adelle Child Theme – > Activate

5. Your child theme is now set up and your customizations will take affect.

Good luck and I hope that helps ??

– Luke

Hallo I need assitance, and please excuse my english…
while trying to get rid of the search botton on the TOP black bar, I deleted the “searchform.php”
BUT actually I removed the search botton widget on the SIDE bar which isn’t there anymore.
of course I didn’t create a child theme…I’m a beginner trying to learn
Is there a way to paste any code in the searchform, to restore the widget search botton?
thanks a lot
Paola
it is for the site https://smartraveller.it

Hi, I am having the same issue and I followed your steps above to create the adelle-child theme, but when I go to my themes to activate it, it says:

Broken Themes

The following themes are installed but incomplete. Themes must have a stylesheet and a template.

Name

Description

Adelle Child The parent theme is missing. Please install the “Adelle” parent theme.

Do you know what I’m doing wrong?

Hi, I am completely new also (but understand syntax… albeit, a little rusty). I have followed every combination of creating a child theme for adelle, e.g. ftp, plug-ins, etc. However, the @import “stylesheet” code is ignored and instead, when I am in the css editor in wordpress is overwritten with the welcome to css comments blurb.

Is it not possible to fully customise adelle as its not listed on bluchic’s site for example child themes? I also stumbled somewhere that it was one of the few sites that needs more than one parent. Also, no one seems to have a working solution.

Hellllllllp!! ??

Salma

Don’t really need to create child theme, try these steps:

1- Install and activate Jetpack
2- Activate Jetpack’s Custom CSS (usually it is activated once you activate the plugin, but double check)
3- Go to Appearance – Edit CSS
4- Key in the CSS mentioned by @daftduke

.header-form {
    display: none;
}

5- Update the custom CSS.

That should do the trick.

Thank you @wongpk. Worked perfectly!!

Hello

Can you help me please. I followed your suggestion , but for me it did not work .

This includes css

.header-forma {
display: none;
}

Is there something else I can do ?

Please help me.

Thank you very much !

Please confirm the CSS you are using, I see some spelling error (?).

Not to worry, I gave up and have been using twenty twelve and customising from scratch. I am enjoying learning new things.