Integration Transformation to Angular or AngularJs

[soufianeX]

Hello,

I wanted to transform the site to Angularjs project, what do you advice me to do exactly ?

 

Thank you very much. That will help me a lot.

[Laura]

Hello, will assign the ticket to a higher support level who can help and advise you in your query.
Thanks! ?

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

Laura Solanes - Graphic Designer and Web Designer

Please be patient as I try to answer each topic as fast as i can.

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Always happy to help you 🙂

[soufianeX]

Thank you.

[Radu]

Hi,
There are no specific instructions or pre-maden one, so in other words i’m not sure cuz no similar case in the past.

Theoretically it can be done easily by loading the script in the head .. and then depending by what functionality you need to achieve… are different instructions.. anyway we cannot support custom changes like this one we can only give advices for customization of the template at files level, and a developer will be able to implement the angular js into theme.

Cheers
R

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[soufianeX]

I used this technique. But I seems that it’s difficult to behave the jquery & angular code at the same application.

I tried, it works, but some animations don’t work very well: header, sticky.js …
I’ll try to start a from scratch project with the minimal angular setup, and then i’ll import all the needed functionnalities.

Thank you for your quick respons

[Radu]

Hi,

I see, it’s a good approach to start angular minimal setup and then to pull only the data you need, you can do it also via WP rest api https://developer.wordpress.org/rest-api/

Cheers
R

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[soufianeX]

I used this technique. But I seems that it’s difficult to behave the jquery & angular code at the same application.

I tried, it works, but some animations don’t work very well: header, sticky.js …
I’ll try to start a from scratch project with the minimal angular setup, and then i’ll import all the needed functionnalities.

Thank you for your quick response

[Radu]

Hi
I think you will have to drop the jQuery and to use the angular features instead jQuery ones, yes..i know implies lot of work…

Here are some basic angular animations from where you can inspire.
https://www.w3schools.com/angular/angular_animations.asp

Cheers
R

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[soufianeX]

Hello,

Thank you for your help. I started with a from scratch angularjs project. I injected incrementaly the jquery plugins. everything works well.

Except 2 problems that I want to get rid of:

1 – when the page starts the images have a gray state and after this they apear with a fade effect. Sometimes they get trapped in the gray states (image 1 attached). I wanted to know where do I change this effect and even remove it.

2 – when I’m on my phone sometimes on the portrait vision / normale vision, the hero images appear very big ( Image 2 ): not adapted to the screen.

Thank you.

Attachments:

You must be logged in to view attached files.

[Radu]

Hi,

1. In general if a animation stops performing or stuck at certain time always it’s better to check if it’s a js error triggered there because if you have a error in page all next js based animations will fail/stuck.

To can prevent css animations without changing the core files you can additionally use a selector similar to this one.

COPY CODE

.image-wrapper *{
-moz-transition: none !important;
-webkit-transition: none !important;
-o-transition: color 0 ease-in !important;
transition: none !important;
}

Or

COPY CODE

.image-wrapper *{
-moz-transition: none !important;
-webkit-transition: none !important;
-o-transition: color 0 ease-in !important;
transition: none !important;
}

2. It may be caused by same issue like 1, if a js error it’s trow all JS scripts that scales or resize things will stop.

Those may be because the mod that you are trying to do, something conflicts at some point.

Do some test with the browser console open

Cheers
R

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[Author]

Posts