Topic-icon jQuery conflicts with JLinked

Active Subscriptions:

None
10 years 6 months ago #37141 by 7of9
Replied by 7of9 on topic jQuery conflicts with JLinked
Hi,

I found another problem with the styling of JLinked button at the JFCLogin, when the user is logged in. Please check the attached picture.
Thanks in advance.
The topic has been locked.
Support Specialist
10 years 6 months ago #37195 by alzander
For the Share button, the LinkedIn Javascript is being included with the following line:
<script type="text/rocketscript" data-rocketsrc="//platform.linkedin.com/in.js?async=true"></script>
I'd try disabling the CloudFlare RocketScript feature and see if that makes things work. I know that alters and re-orders where the Javascript loads, and that may be preventing the loading of that script properly. That's just a guess because I don't see anything else wrong on that page with the LI Share button.

For the Reconnect buttons, those do look pretty bad. Can you try switching the "Button Type" in the SCLogin module to "Icon" or "Icon + Text" to see if those buttons look better there? Those may not be the buttons you want for the login view, but it may help provide something 'now'. If so, we can help you setup the Javascript buttons for Login and icon or icon+text buttons for the reconnect feature.

Thanks,
Alex
The topic has been locked.
Active Subscriptions:

None
10 years 6 months ago - 10 years 6 months ago #37219 by 7of9
Replied by 7of9 on topic jQuery conflicts with JLinked
Hi Alex,

Disabling the CloudFlare RocketScript had no effect, except that my web page was loading slower. The Rocket Script loads the js asynchronous, so the page will load faster.
I also have a problem with Linkedin, with the social tabs module I have at the top / left of every page, the one with the multiple social networks' tabs. Linkedin tab was working fine, until I installed JLinked.

About the Button Type, I tried Icon with text. Although they are now styled correctly, those buttons are:
1. Much taller, causing my page to be even longer.
2. They have a problem with the black background at the corners.
3. It does not seem to be working in English.

I am attaching three screen caps:
Connected in Greek


Connected in English


Disconnected in Greek


Please advice.
Last edit: 10 years 6 months ago by 7of9.
The topic has been locked.
Active Subscriptions:

None
10 years 6 months ago #37423 by 7of9
Replied by 7of9 on topic jQuery conflicts with JLinked
Any help, please?
The topic has been locked.
Support Specialist
10 years 6 months ago #37454 by alzander
Sorry for the delay. For the LinkedIn Share button, I'm not sure what's happening there. I understand that Cloudflare may be helping, but it's making it difficult to diagnose the problem. Usually, Cloudflare allows testing with direct.domain.com, but on your site, that isn't working. Can you enable that feature so we can test with Cloudflare disabled? Right now, the LinkedIn Javascript is not being setup how it should, and the only reason I can guess is because of Cloudflare.

I also have a problem with Linkedin, with the social tabs module I have at the top / left of every page, the one with the multiple social networks' tabs. Linkedin tab was working fine, until I installed JLinked.

This issue is likely related to the Javascript file above not being loaded properly. Once we fix one, the other should fix as well.

Finally, for the buttons, you mention a few things you're not happy with, but I'm not sure what you want to accomplish. I also looked at your page and the Javascript button types seem to be aligned correctly now and look good. If that's not what you're looking for, let me know. We can help guide you in replacing the image buttons we use by default if you have alternatives. We just need to understand what you're looking for.

Thanks,
Alex
The topic has been locked.
Active Subscriptions:

None
10 years 6 months ago - 10 years 6 months ago #37469 by 7of9
Replied by 7of9 on topic jQuery conflicts with JLinked
Hi Alex,

alzander wrote: Sorry for the delay. For the LinkedIn Share button, I'm not sure what's happening there. I understand that Cloudflare may be helping, but it's making it difficult to diagnose the problem. Usually, Cloudflare allows testing with direct.domain.com, but on your site, that isn't working. Can you enable that feature so we can test with Cloudflare disabled? Right now, the LinkedIn Javascript is not being setup how it should, and the only reason I can guess is because of Cloudflare.

I can deactivate Cloudflare for you to test. However I need a precise schedule from you, when you want me to disable it and until when. I cannot afford to have it inactive for days, since it's bad for my site's SEO.

alzander wrote: Finally, for the buttons, you mention a few things you're not happy with, but I'm not sure what you want to accomplish. I also looked at your page and the Javascript button types seem to be aligned correctly now and look good. If that's not what you're looking for, let me know. We can help guide you in replacing the image buttons we use by default if you have alternatives. We just need to understand what you're looking for.

I have two issues here:
1. Please compare the image file Connected_en with Connected_el. It seems fine when I am connected and switched in to Greek, however when I switch the language in to English, the formatting of the social connect buttons is getting messed up again. Do you see how bad Connected_en looks?
2. The social connect buttons appear to have been cut from a white background and so they have some white pixels remaining at their corners and it does not look good with my black background. Please check the logout button right above them to see how smooth its corners look versus the social connect buttons' corners. Please note that google+ social connect button looks great though. You should work on /media/sourcecoast/images/provider/button_facebook.png and /modules/mod_sclogin/images/button_linkedin.png as opposed to /media/sourcecoast/images/provider/button_google.png, which looks fine.

Looking forward to your reply.
Last edit: 10 years 6 months ago by 7of9.
The topic has been locked.
Support Specialist
10 years 6 months ago #37555 by alzander

I can deactivate Cloudflare for you to test. However I need a precise schedule from you, when you want me to disable it and until when. I cannot afford to have it inactive for days, since it's bad for my site's SEO.

This is why CloudFlare has the direct.yourdomain.com URL setup by default. That should let you bypass CloudFlare without having to disable it for your normal traffic. If you can look into why that's not working, that would be an easy black/white test to see if that's the problem.

If not, we'll be able to dive into this tomorrow and investigate further.

1. Please compare the image file Connected_en with Connected_el. It seems fine when I am connected and switched in to Greek, however when I switch the language in to English, the formatting of the social connect buttons is getting messed up again. Do you see how bad Connected_en looks?

I see how bad it looks in your image, but I haven't been able to test. I tried to click the Register button, but could not create an account. The registration form fails with the "State" field highlighted, although there are no options for me to select from in that drop-down. Without being able to login with a test Joomla account, I can't see what the 'reconnect' buttons look like. Let me know when that's fixed, and I'll gladly try again.

The social connect buttons appear to have been cut from a white background and so they have some white pixels remaining at their corners and it does not look good with my black background.

You're correct. It seems like some of our buttons were not exported properly with transparency on the edges. This will be fixed in the next release.

Thanks,
Alex
The topic has been locked.
Active Subscriptions:

None
10 years 6 months ago - 10 years 6 months ago #37565 by 7of9
Replied by 7of9 on topic jQuery conflicts with JLinked

alzander wrote: This is why CloudFlare has the direct.yourdomain.com URL setup by default. That should let you bypass CloudFlare without having to disable it for your normal traffic. If you can look into why that's not working, that would be an easy black/white test to see if that's the problem.

If not, we'll be able to dive into this tomorrow and investigate further.

I really don't know about this. So far Cloudflare has suggested to deactivate in order to test. I need to investigate this method.

I see how bad it looks in your image, but I haven't been able to test. I tried to click the Register button, but could not create an account. The registration form fails with the "State" field highlighted, although there are no options for me to select from in that drop-down. Without being able to login with a test Joomla account, I can't see what the 'reconnect' buttons look like. Let me know when that's fixed, and I'll gladly try again.

This is VM Registration. You need to select the country first, in order for the state list to be populated. Try to select USA, or Greece.
Edit: I found out what the problem was, with the styling. I am using Falang for the translation and it seems the English translation (my default language is Greek), was still using the old format. I deleted and recreated the translation and that fixed the problem.

You're correct. It seems like some of our buttons were not exported properly with transparency on the edges. This will be fixed in the next release.

Glad to hear you will fix it. Also, Google+ button is different than the rest of the buttons. It's somewhat flat, while the others use a 3D bevel effect. I suggest to keep only one style for all.

Thanks in advance.
Last edit: 10 years 6 months ago by 7of9.
The topic has been locked.
Support Specialist
10 years 6 months ago #37591 by alzander

really don't know about this. So far Cloudflare has suggested to deactivate in order to test. I need to investigate this method.

The article below describes their 'direct' subdomain that is added to all accounts:
support.cloudflare.com/hc/en-us/articles...t-subdomain-working-
More information is also here in the "Keep all subdomains on CloudFlare" section.

I'm not sure why it's not working, but I'd check that you have that subdomain or another one with the cloud icon greyed out that can be tested with.

This is VM Registration. You need to select the country first, in order for the state list to be populated. Try to select USA, or Greece.
Edit: I found out what the problem was, with the styling. I am using Falang for the translation and it seems the English translation (my default language is Greek), was still using the old format. I deleted and recreated the translation and that fixed the problem.

Still not working for me. See the image below. There are no state selection options to choose from:
File Attachment:

Also, Google+ button is different than the rest of the buttons. It's somewhat flat, while the others use a 3D bevel effect.

Agreed they should be standard. I don't think it should look like what you see. My guess is that there's a style in your template that's adding that transition/3D effect to it. Once we can register, we'll gladly investigate what it could be.

Thanks,
Alex
The topic has been locked.
Active Subscriptions:

None
10 years 6 months ago - 10 years 6 months ago #37595 by 7of9
Replied by 7of9 on topic jQuery conflicts with JLinked

alzander wrote: I'm not sure why it's not working, but I'd check that you have that subdomain or another one with the cloud icon greyed out that can be tested with.


I just fixed direct.allmassage.gr and traffic is rerouted directly to my server, bypassing cloudflare. However problem remains, you can use it to track the problem.

Still not working for me. See the image below. There are no state selection options to choose from:


This is very strange check out my image:
Anyway, I have created a new shopper / user. user id and password is you forum handle. Please change your password when you first connect.

Agreed they should be standard. I don't think it should look like what you see. My guess is that there's a style in your template that's adding that transition/3D effect to it. Once we can register, we'll gladly investigate what it could be.


I don't think it's my template that styles the button like this, since they are all images. Check this out:
Facebook image (Path is set to your component media): URL: direct.allmassage.gr/media/sourcecoast/i.../button_facebook.png
Google+ image (Path is set to your component media): URL: direct.allmassage.gr/media/sourcecoast/i...er/button_google.png

As you can see, facebook image is clearly 3D beveled without any styling.

Thanks in advance.
Last edit: 10 years 6 months ago by 7of9.
The topic has been locked.