Return to previous page

Footer icons - by bazarcollective - on WordPress WooCommerce support

This topic has 25 replies, 4 voices, and was last updated 9 years ago ago by Jack Richardson

bazarcollective

Participant

November 6, 2015 at 17:52

hello guys
i need help w a couple things on my footer. id like to add space between “follow us” and social icons/ center social icons under “follow us” also want to change the color, size for payment options. i had someone on fiverr helping but they kept having trouble everytime they add an edit the social icons on my front page distort on pc/mobile. ive included a screen shot, hope you can help.
thanks

Please, contact administrator
for this information.

#98206 Copied Theme version: 2.3 WooCommerce version: 4.3.1

24 Answers

Eva Kemp

Support staff

November 6, 2015 at 18:34

Hello,

Please provide us with wp-admin panel credentials in Private Content.

Regards,
Eva Kemp.

#98213 Copied

bazarcollective

Participant

November 6, 2015 at 19:28

ok. sure

Please, contact administrator
for this information.

#98215 Copied
Robert Hall

Support staff

November 7, 2015 at 09:35
Hello,

I’ve added the following code in Child Theme. Please check it.
```
#mla-text-widget-2 .widget-title{
    margin-bottom: 48px;
}
.soci-icons2 .vc_icon_element.vc_icon_element-outer .vc_icon_element-inner{
    margin-left: 3px;
}
.payment-methods {
    color: red;
    font-size: 10px;
}
```
Regards,
Robert Hall.
#98242 Copied
bazarcollective

Participant

November 7, 2015 at 13:11

Hello Robert
thanks for that!
what code can i add to move the subcribe form to the left?
looks a little off.
thanks!

#98255 Copied
Eva Kemp

Support staff

November 8, 2015 at 09:48
Hello,

I’ve edited the code in Theme Options > Custom CSS > Global Custom CSS from:
```
.soci-icons2 {
  margin-right: 85px;
}
```
to
```
.soci-icons2 {
  margin-right: 50px;
}
```
Please check now.

Regards,
Eva Kemp.
#98291 Copied
bazarcollective

Participant

November 9, 2015 at 04:16

hey guys i didnt check the icons on mobile before. the icons shift to the left its the same thing we were having trouble w everytime we tried an edit. please look at my screen shots both mobile and landscape view.
thanks

Please, contact administrator
for this information.

#98354 Copied

Jack Richardson

Support staff

November 9, 2015 at 08:36

Hello,

What browser are you checking in?
I see this footer on desktop:
http://storage1.static.itmages.com/i/15/1109/h_1447054584_8450452_69261315cd.png

Best regards,
Jack Richardson.

#98362 Copied

bazarcollective

Participant

November 9, 2015 at 13:54

its on mobile view iphone 6 plus did you see both screenshots i attached?

#98424 Copied

bazarcollective

Participant

November 9, 2015 at 13:56

both screen shots are from iphone6 plus vertical and landscape mobile view

#98425 Copied
Jack Richardson

Support staff

November 9, 2015 at 19:05
Hello,

Add this code in Custom CSS for mobile:
```
.widget_mc4wp_widget .widget-title {
    width: 300px;
}
.footer-top .widget_mc4wp_widget {
   padding-top: 50px;
}
.soci-icons2 {
    border-right: none;
}
```
and this code to Custom CSS for mobile landscape:
```
.footer-top .vc_icon_element.vc_icon_element-outer.vc_icon_element-align-center {
    margin-left: 150px;
}
.soci-icons2 {
   border-right: none;
}
.widget_mc4wp_widget .widget-title {
    width: 300px;
    margin-left: 150px;
}
```
Best regards,
Jack Richardson.
#98498 Copied
bazarcollective

Participant

November 10, 2015 at 05:35

Hello Jack ive tried adding the codes in Custom CSS for mobile and CSS for mobile landscape but everything is still the same. anything else i can try?

#98561 Copied

Eva Kemp

Support staff

November 10, 2015 at 09:21

Hello,

As I see now footer is shown properly:
http://storage4.static.itmages.com/i/15/1110/h_1447143675_2630567_63ce7f9eb3.png

Please show us screenshots from your side.

Regards,
Eva Kemp.

#98584 Copied

bazarcollective

Participant

November 10, 2015 at 14:25

Hello Eva
Have you read the trough thread? The footer is good in pc view. Its the mobile and mobile landscape views i need help w. The footer in mobile /mobile landscape view looks the same as prior screenshots i had attached. The only thing that changed slighty after adding the codes that Robert provided was the text for the subscribe box. here are the screen shots again. let me know if you need anything else.
thanx

Please, contact administrator
for this information.

#98661 Copied
Jack Richardson

Support staff

November 10, 2015 at 17:15
Hello,

I’ve added this code in child style.css file:
```
@media (max-width: 480px) {
  .widget_mc4wp_widget .widget-title {
    width: 300px;
}
.footer-top .widget_mc4wp_widget {
   padding-top: 50px;
}
.soci-icons2 {
    border-right: none !important;
}

.footer-top.footer-top-1 .vc_icon_element.vc_icon_element-outer.vc_icon_element-align-center {
    margin-left: 70px;
}}
```
```
@media (min-width: 480px) and (max-width: 680px) {
  .footer-top.footer-top-1 .vc_icon_element.vc_icon_element-outer.vc_icon_element-align-center {
    margin-left: 200px !important;
}
.soci-icons2 {
   border-right: none !important;
}
.widget_mc4wp_widget .widget-title {
    width: 300px !important;
    margin-left: 150px !important;
}}
```
Please clear browser cache and check footer now.

Best regards,
Jack Richardson.
#98688 Copied
bazarcollective

Participant

November 10, 2015 at 17:47

hello jack
i checked both views and now the icons and subscribe form text are to right on mobile and icons are to left on landscape. see screenshots

Please, contact administrator
for this information.

#98699 Copied

Jack Richardson

Support staff

November 10, 2015 at 19:36

Hello,

As I see you edited the code I provided in the previous post.
I’ve edited it back.

Please check the site now.

Best regards,
Jack Richardson.

#98715 Copied

bazarcollective

Participant

November 11, 2015 at 05:03

Hey guys
Im starting to think i wont ever get this fixed.
Maybe too difficult? im checking the footer on iphone 4 also iphone 6 plus.
footer looks different for both. here are the screen shots.

Please, contact administrator
for this information.

#98771 Copied

Jack Richardson

Support staff

November 11, 2015 at 08:58

Hello,

Please look at the screenshots what I see from my side:
http://storage8.static.itmages.com/i/15/1111/h_1447228645_4511102_9009a478d0.png
http://storage1.static.itmages.com/i/15/1111/h_1447228689_6464611_bbb2d66368.png

Please try to check with other devices and other Internet provider.

Thank you.

Best regards,
Jack Richardson.

#98792 Copied

bazarcollective

Participant

November 11, 2015 at 16:55

ok i checked and it only looks like that for iphone 6. the footer isnt properly showing for iphone 4/ iphone 5/ iphone 6 plus. do they all need different css?

#98906 Copied
Jack Richardson

Support staff

November 11, 2015 at 18:19
Hello,

I’ve edited the code in child style.css file to this:
```
@media (max-width: 480px) {
  .widget_mc4wp_widget .widget-title {
    width: 100%;
}
.footer-top .widget_mc4wp_widget {
   padding-top: 50px;
}
.soci-icons2 {
    border-right: none !important;
}

.footer-top.footer-top-1 .vc_icon_element.vc_icon_element-outer.vc_icon_element-align-center {
    margin-left: 20%;
}}

@media (min-width: 480px) and (max-width: 680px) {
  .footer-top.footer-top-1 .vc_icon_element.vc_icon_element-outer.vc_icon_element-align-center {
    margin-left: 36% !important;
}
.soci-icons2 {
   border-right: none !important;
}
.widget_mc4wp_widget .widget-title {
    width: 50% !important;
    margin-left: 20% !important;
}}
```
Please check footer now.

Best regards,
Jack Richardson.
#98922 Copied
bazarcollective

Participant

November 11, 2015 at 18:44

ok finally its getting there! 🙂
all views are good except iphone 6 plus the twitter icon appears below the instagram icon and on iphone6+ landscape view the icons and “subcribe to our nesletter” arent centererd theres also a border line that should only be visible on pc view. im attaching a screen shot

Please, contact administrator
for this information.

#98928 Copied
Jack Richardson

Support staff

November 12, 2015 at 09:29
Hello,

I’ve edited the code again:
```
@media (max-width: 380px) {
  .widget_mc4wp_widget .widget-title {
    width: 100%;
}
.footer-top .widget_mc4wp_widget {
   padding-top: 50px;
}
.soci-icons2 {
    border-right: none !important;
}
.footer-top.footer-top-1 .vc_icon_element.vc_icon_element-outer.vc_icon_element-align-center {
    margin-left: 20%;
}}

@media (min-width: 380px) and (max-width: 480px){
  .widget_mc4wp_widget .widget-title {
    width: 100%;
}
.footer-top .widget_mc4wp_widget {
   padding-top: 50px;
}
.soci-icons2 {
    border-right: none !important;
}}

@media (min-width: 480px) and (max-width: 750px) {
  .footer-top.footer-top-1 .vc_icon_element.vc_icon_element-outer.vc_icon_element-align-center {
    margin-left: 36% !important;
}
.soci-icons2 {
   border-right: none !important;
}
.widget_mc4wp_widget .widget-title {
    width: 50% !important;
    margin-left: 20% !important;
}}
```
Please check now.

Best regards,
Jack Richardson.
#99026 Copied
bazarcollective

Participant

November 12, 2015 at 17:22

You did it! Looks great.
Thank you so much for all the time and effort you guys put into 8 themes! learning so much from you guys 🙂

#99145 Copied

Jack Richardson

Support staff

November 12, 2015 at 18:33

Hello,

You’re welcome.
We’d be thankful if you leave a comment on our site http://themeforest.net/item/royal-multipurpose-wordpress-theme/8611976/comments .

Best regards,
Jack Richardson.

#99156 Copied
Tagged: customizable, design, footer icons, seo friendly, themes, woocommerce, wordpress
Viewing 25 results - 1 through 25 (of 25 total)