Altitude Footer Credits + Social Icons?

[Vasilis]

Hey awesome people!

I'm thinking if it is possible to add Simple Social Icons at the right side where Altitude's footer credits are?

Here is my website => http://cleancar.me

I would like to place the social icons at the right side of where the footer credits are.

Kindly appreciate your help.

~ Vasilis

---

Marketing & Business Development Consultant Located in Bangkok, Thailand @ PowerHouse Consulting Group

[Erik D. Slater]

In your functions.php file, you could change

add_theme_support( 'genesis-footer-widgets', 1 );

to

add_theme_support( 'genesis-footer-widgets', 2 );

to give you a second footer widget ... and then add Simple Social Icons into the new Footer 2 widget.

---

Erik D. Slater: Digital Platform Consultant • LinkedIn

[Erik D. Slater]

Ahhh ... hang on a sec ... that may not work in your case here ... since I don't think you're using your footer widgets ...

---

Erik D. Slater: Digital Platform Consultant • LinkedIn

[Erik D. Slater]

This might help: http://briangardner.com/add-social-icons-footer/

---

Erik D. Slater: Digital Platform Consultant • LinkedIn

[Vasilis]

Yeah this is what I've been looking for a while,

however Brian talks about social footer widget...

I'm talking about the footer credits part...

Isn't there a difference between the hooks or it should work as normal?

Thank you once again Erik!

---

Marketing & Business Development Consultant Located in Bangkok, Thailand @ PowerHouse Consulting Group

[Erik D. Slater]

Taken straight from my almost-completed custom theme (for the Rainmaker platform) ... which widgetizes the page footer ... which will then allow you to completely customize the page footer (i.e. not the footer widgets) in the Widgets area rather than hooking into the relevant filter.

// Register "Page Footer" Widget
genesis_register_sidebar(
	array(
		'id'		=> 'eds-page-footer',
		'name'		=> __('Page Footer', CHILD_THEME_NAME),
		'description'	=> __('Widgets added here will display output at the bottom of the page.', CHILD_THEME_NAME),
	)
);

// Replace default footer ouptut with widgetized area
// @since 1.0.0
add_filter('genesis_footer_output', 'eds_genesis_footer_output', 10, 3);
function eds_genesis_footer_output($output, $backtotop_text, $creds_text)
{
	dynamic_sidebar('eds-page-footer');
}

This should then allow you to make use of the Simple Social Icons plugin.

Just remember to remove any other filter for the footer to avoid possible weirdnesses ...

---

Erik D. Slater: Digital Platform Consultant • LinkedIn

[Vasilis]

Hey Erik,

The php code continuously breaks my site.

Maybe I should remove the "eds" part in front of the php function names?

I'm an amateur when it comes to php

Kindly Appreciated

---

Marketing & Business Development Consultant Located in Bangkok, Thailand @ PowerHouse Consulting Group

[Erik D. Slater]

When you say it breaks your site, are you getting any error messages?

If you like, you can send me your functions.php to [email protected] ... just in case there is a paste issue (that's happened before).

The "eds" part just makes any function declarations unique ... which is necessary if you collect various code snippets from all over the place 🙂

---

Erik D. Slater: Digital Platform Consultant • LinkedIn

[Erik D. Slater]

There is another piece of code you may need:

// Enable execution of shortcodes in widgets
add_filter('widget_text', 'do_shortcode', 10, 1);


You'll need this to enable the interpretation of shortcodes when used inside a widget.

Sorry about that 🙂

---

Erik D. Slater: Digital Platform Consultant • LinkedIn

[Vasilis]

Just send you my functions.php file Erik

I can't express how much I thank you.

Kind Regards

---

Marketing & Business Development Consultant Located in Bangkok, Thailand @ PowerHouse Consulting Group

[Erik D. Slater]

Thanks for sending the file ... but I don't my code proposals in there. Did you take it out?

Also, did you try out that last code snippet I provided there?

---

Erik D. Slater: Digital Platform Consultant • LinkedIn

[Vasilis]

Ok I found what was breaking the php,

there were missing some " ' " from the php

Now WORKING OK!

Not same lines though....the appear differently,

probably something in Css, right?

Check it on website: http://cleancar.me

Kind Regards

---

Marketing & Business Development Consultant Located in Bangkok, Thailand @ PowerHouse Consulting Group

[Erik D. Slater]

Oh good. Glad that's working now 🙂

And yeah, styling is always that "next" bit that needs to be sorted 🙂

Since I last saw your page, you appear to have added a new dropdown menu to your footer there.

For the .simple-social-icons selector, you could add float: left; or float: right; ... depending on where you want it.

---

Erik D. Slater: Digital Platform Consultant • LinkedIn

[Vasilis]

Yeah I was testing something to add the same language selector as on the nav menu just after the social icons.

But for now what I would like to do is bring the social icons at the same horizontal level with the footer credits cause now they are one line higher I think.

Is this possible?

---

Marketing & Business Development Consultant Located in Bangkok, Thailand @ PowerHouse Consulting Group

[Erik D. Slater]

I think you missed my last post there 🙂

Add float: right; to .simple-social-icons if you want the social icons aligned to the right.

---

Erik D. Slater: Digital Platform Consultant • LinkedIn

[Vasilis]

Hey Erik,

I checked this CSS part but I think it does not apply for the Simple Social Icons on the footer credits part...

At least I cant see any change when placing this code in my CSS.

I did it like this

/* Simple Social Icons
--------------------------------------------- */

.altitude-home .content .simple-social-icons {
margin-top: 40px;
float: right;
}

.altitude-home .content .simple-social-icons ul li {
margin: 0 20px !important;
}

.altitude-home .content .simple-social-icons ul li a,
.altitude-home .content .simple-social-icons ul li a:hover {
padding: 30px;
}

The problem is that social icons are in different line and not aligned with footer credits at the same horizontal space.

Social Icons appear one line before the footer credits.

Can we bring this at the same horizontal level?

Kindly appreciated.

---

Marketing & Business Development Consultant Located in Bangkok, Thailand @ PowerHouse Consulting Group

[Erik D. Slater]

Alrighty then ... here it is, my friend 🙂

(1) Remove the float: right; from where you placed it under .altitude-home .content .simple-social-icons. Even if that did work, it would only do so on your home page.

(2) Immediately above that .altitude-home .content .simple-social-icons definition, add the following:

.simple-social-icons {
float: right;
}


---

Erik D. Slater: Digital Platform Consultant • LinkedIn

[Erik D. Slater]

Take a looksy at this screenshot ...

---

Erik D. Slater: Digital Platform Consultant • LinkedIn

[Vasilis]

Ok awesome!!!

That did the trick!

Thank you very much 🙂

Now how would I be able to add the flag language selector right next to them?

You think it is possible?

---

Marketing & Business Development Consultant Located in Bangkok, Thailand @ PowerHouse Consulting Group

[Erik D. Slater]

You think it is possible?

I KNOW it's possible ... although I don't know on which side you want it 🙂

I'd place it in a text widget in your newly-acquired Page Footer widget area. Styling will be required afterwards ... which will likely replace the bit we just added 🙂

The only thing is ... your footer is likely going to look a bit messy on narrower widths, i.e. mobile devices and lower screen resolutions. There is an easy fix for that ... but one thing at a time 🙂

---

Erik D. Slater: Digital Platform Consultant • LinkedIn

[Author]

Posts