Please disregard the code I shared above and see the latest version of functions.php.

I made progress getting everything on one line, but I can’t seem to figure out the settings to get the inputs aligned with the submit button and get them centered vertically in the top bar.

I do need to make sure the styling of the opt-in looks right cross-browser.

I decided to just not display the form on mobile, only a link to an opt-in page – but now that’s not appearing correctly on mobile?

Also, it appears that the logo (text) image may have gotten bumped down due to opt-in in the small top bar?

I found a new AWeber horizontal opt-in form generator… however I need the heading to be to the left of the input fields (not on top) and I need the ‘Count Me In!’ submit button to be wider so that the text is all on one line. I’ll include the new form code I have put in the functions.php file.
Can anyone please offer the styling adjustments needed to get the look I want?

• This reply was modified 6 years, 4 months ago by Moondreamer21.

Thanks Mike. Below the
if(isset($avia_config[‘use_child_theme_functions_only’])) return;
line in functions.php, I added this code:

// Register new icon as a theme icon
function avia_add_custom_icon($icons) {
$icons[‘icon_name’] = array( ‘font’ =>’fontello’, ‘icon’ => ‘ue800’);
return $icons;
}
add_filter(‘avf_default_icons’,’avia_add_custom_icon’, 10, 1);

// Add new icon as an option for social icons
function avia_add_custom_social_icon($icons) {
$icons[‘Icon Label’] = ‘icon_name’;
return $icons;
}
add_filter(‘avf_social_icons_options’,’avia_add_custom_social_icon’, 10, 1);

Under Enfold – Import/Export I saw the option there to upload Fontello Font Zip. I clicked on the link there to Fontello, and selected a thumbs up Font Awesome icon. I downloaded it, but it wasn’t actually in a .ZIP file… so I couldn’t upload it.

So now I’m stuck – am I taking the right steps? What should I do next?

Thanks! That did the trick once I removed the hex code background color from the logo area settings.
Although now it seems that the background image is REALLY stretched out – the grungy irregular edge is blurry.
I’ll attach my site link and all my additional css in the private section in case there is something conflicting?
I appreciate your help!

Good to know, thanks so much!

Thank you! Can you provide code to change the background color of the search bar when typed in?
And also the color of the backgrounds of the search items that drop down, etc. whether on desktop or mobile – I see some differences between them.

Great, thanks – we’re making progress!
On the mobile menu when it drops down, the text turns the same color as the background and isn’t visible on the selected links. How can I make all text links there on that mobile menu white even when they are hovered/clicked?

Its set in the General Styling area for Alternate Content, not custom CSS right now.

Hi Jordan, I see it’s working now but yes – I’d still like help with styling.
Do you have code to change the ‘search’ font that is INSIDE the search box? And how can I change that if I want to make the text all caps or lower case?

Thanks Nikko, I can live with the arrangement of the socket menu on mobile as they are.
Another question I had though, was that I want the irregular top edge of the dirt background in the socket (a transparent .png) to overlap the leather tooling background of the footer area above it.
I’d like the same effect for the logo area purple/pink gradient image which has a grungy, irregular edge on the bottom – would like that to overlap the slider image below it.
Can I get help with code for bot of these things? Thank you!

Thank you! Do you have code to change the ‘search’ font that is INSIDE the search box? And how can I change that if I want to make the text all caps or lower case?

Hello, I am still not seeing the opt-in form come up in the small top bar. I added the form to a code block lower in the page and it shows up OK, but when I add your code above to the functions.php file, it doesn’t show in the small top bar (which is enabled – I have social media icons showing in it).

I’ll post my site url info. in the private section if you could take a closer look? Thanks.

To update you, I refreshed my page again and realized that code I shared above in the functions.php file brought the whole site down. Please advise?

Sure, I’ll provide the link to the site in the private content. Please let me know if you need anything else.

Thank you! This worked, however the search bar covers the entire width of the site.
How can I set the css of the search bar to be the same as they would if it was used in a normal position anywhere else? And is there a place I can make adjustments to exactly where/how it’s positions, the colors, etc.?