Trying to stop JS to add in-line CSS for the .orig class

Home Forums Product Support Forums Ajax Search Pro for WordPress Support Trying to stop JS to add in-line CSS for the .orig class

This topic contains 19 replies, has 2 voices, and was last updated by Pavelescu Razvan Pavelescu Razvan 7 years, 3 months ago.

Viewing 15 posts - 1 through 15 (of 20 total)
  • Author
    Posts
  • #4447
    Pavelescu Razvan
    Pavelescu Razvan
    Participant

    Hello,

    Awesome plugin, smooth functionality and very well written code!

    – I am working localhost

    A friend bought the ASP and asked me to customize it (how the input looks).

    On the way I am keeping the default CSS classes names so I won’t lose the functionality. (.orig .ajaxsearchpro and others)

    I have deleted some CSS rules from some .css files that I am not using. That worked okay.
    ——-

    The issue is that you have somewhere written JS functions that are adding in-line CSS and also automatically generate CSS code.

    This inline CSS code generated for the .orig and .ajaxsearchpro classes are making my design to fail.

    Could you please tell me how to deactivate the automatic in-line CSS generate script for the .orig and .ajaxsearchpro classes?

    —-
    I’ve found that in the \js\nomin\jquery.ajaxsearchpro.js line 1477 the script is adding 3 rules (width, position and z-index) to the .orig input. printscreen: http://screencast.com/t/n5wbRUNjd

    I’ve deleted them (same in the nomin-scoped directory), but those rules are still added in-line to the .orig input
    —-

    In conclusion, as I said above, please tell me where can I deactivate the JS functions that are generating the in-line CSS?

    thanks and looking forward to hear from you soon,
    Razvan

    • This topic was modified 7 years, 3 months ago by Pavelescu Razvan Pavelescu Razvan. Reason: added login details
    #4449
    Pavelescu Razvan
    Pavelescu Razvan
    Participant

    Hello again, – I was not able to open another ticket

    I want to modify the results query in order to receive also custom fields from custom post types.

    I identified the search query: http://screencast.com/t/2pYWz5Y0Z24

    I want to modify the query to also receive a “clx_event_city” postmeta information for the resulsts. How can I achieve that?

    So this is the DB table: http://screencast.com/t/Neisgn8cGz

    I know a bit of MySQL syntax, but I do not know how to get this information as the clx_event_city field is not in the default wp_post table.
    As you might already know, the custom meta posts are saved in the wp_postmeta, and I would have make a join to get the ids for the resulsts.

    How can I achieve this in terms of MySql query? Could you give me an example of a join?

    I know you are not here to cover our customization but I am having a hard time understanding your query syntax as it’s quite large and intimidating: http://screencast.com/t/0FeX9axHn

    thanks a lot,
    Razvan

    #4450
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    Hi!

    I highly discourage you to do direct modifications to the search query or javascript codes.

    There are filter and actions hooks available + a template files to do such modifications safely.

    1. The inline CSS is a result of CSS and JS animations, they are mandatory. If I were you I would take a different approach and instead of touching the code, create CSS with higher specificity. For example:

    input.orig {
       width: 200px !important;
    }

    The !important modifier will override the inline CSS, that’s the only option you can use here. I know it’s nasty to use it, but in this case it’s more redundant – because if your friend decides to update the search plugin, all your modifications are gone. However the custom CSS always stays.

    2. Meta fields are stored in the post meta table, but there is a much better way of getting that information than modifying the code. If you haven’t heard of WordPress Plugin API yet, I HIGHLY recommend learning about it. It’s the standard and best way to communicate with a plugin, without touching it’s code.

    In WordPress plugin developement there is something called a “filter”. A filter is an entrance point for a function. Filters are placed to various point of the plugin code by developers (like me) to make data manipulation easier for other developers (like you).
    You can create a function and attach it to a “filter” point. Your function will accept the parameters defined by the filter. For example you can modify any post content by creating a function and attaching it to the filter called “the_content”.

    My plugin also has “filter” points available. You can see the list in the filters.txt file in the main plugin directory. For example usage take a look at this: https://wp-dreams.com/knowledge-base/numbering-the-results/

    Based on that example you can construct the desired code, something like:

    add_filter( 'asp_results', 'asp_get_a_custom_field', 1, 1 );
     
    function asp_get_a_custom_field( $results ) {
      foreach ($results as $k=>$v) {
        // Let's get the meta and store it in the $r->my_meta variable
        $results[$k]->my_meta  = get_post_meta( $results[$k]->id, 'clx_event_city', true )
      }
     
      return $results;
    }

    After that, the my_meta will store the clx_event_city meta value.

    Good luck with coding!

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


    #4483
    Pavelescu Razvan
    Pavelescu Razvan
    Participant

    Thanks for the response!

    I managed to apply the filters and it works smoothly, I appreciate you gave me the function 🙂

    About the CSS rules overwrite, it does not work properly. I have issues with the overwriting of the rules because of the window resize, and other factors.

    The plugin will not be updated anymore, my friend is using it just for a certain job, so could you please tell me where I can find the function that adds the inline css to the .orig class and the instance classes?

    thanks,
    Razvan

    #4486
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    Hi!

    Sure. I suggest you first switch from the minified javascript source to the non-minified. It’s much easier to make modifications to. You can do that on the compatibility settings submenu.

    Then, the file you are looking for is the ajax-search-pro/js/nomin/jquery.ajaxsearchpro.js possibly lines 1477-1481:

    $this.n.text.css({
        width: $this.n.proinput.width() - 2 + $this.n.proloading.outerWidth(true),
        position: 'absolute',
        zIndex: 2
    });

    So basically, this is executed on specific window resize events. If you remove the entire code, or maybe just the width part, it might solve the problem:

    $this.n.text.css({
        position: 'absolute',
        zIndex: 2
    });

    The inline width should not be there visible anymore.

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


    #4503
    Pavelescu Razvan
    Pavelescu Razvan
    Participant

    Once again, thanks for the reply

    ** I have updated the website address and login details
    ** Plugin location on the website: http://screencast.com/t/57PXghsvKzA

    I finished the design and now everything is almost ready.

    I have 2 issues, a big issue and a small one:

    —————————-
    That big issue is that the results from the redirected page are not displayed.

    I checked the “overwrite wordpress results” option, meaning that the search results page should display only the posts delivered by your plugin: http://screencast.com/t/vNf3sXMZ

    Well, nothing shows up, only a couple of warnings: http://screencast.com/t/s6t3YqQZ

    If I don’t check the “overwrite wordpress results” it is showing the default search results from wordpress

    Could you take a look at the plugin configuration and see if I’ve done it right?

    Also, I hope I got it right and the search results should display only events that are delivered by your plugin, as they must be from a certain city

    ————–
    The small issue, the search is not redirecting when you enter 3 chars or change the settings, its redirecting only when you hit enter

    looking forward to hear an opinion,
    Razvan

    • This reply was modified 7 years, 3 months ago by Pavelescu Razvan Pavelescu Razvan. Reason: added ftp + wp login details
    • This reply was modified 7 years, 3 months ago by Pavelescu Razvan Pavelescu Razvan.
    • This reply was modified 7 years, 3 months ago by Pavelescu Razvan Pavelescu Razvan.
    #4505
    Pavelescu Razvan
    Pavelescu Razvan
    Participant

    *** you can use ‘eve’ term keyword and ‘miami’ or ‘bucharest’ location keywords to test the functionality

    *** normal results listing using the results shortcode works smoothly, there is no issue

    #4519
    Pavelescu Razvan
    Pavelescu Razvan
    Participant

    Hey,

    I hope you can help me with the search results error.

    Could you point me where you re-write the default wordpress search resulsts for a string?

    As I said above, nothing shows up, just some warnings: http://screencast.com/t/s6t3YqQZ

    thanks,
    Razvan

    #4530
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    Hi!

    You had a custom filter enabled, which does not match anything, plus the search in posts and pages was disabled.

    Moreover the search.php file in your theme does invoke new queries based on the default search query, I’m guessing because of the grouping of the results. The problem with that is, that there is no way of overriding those queries from plugin code, so you might need to do it programaticaly. It means that the theme already has it’s custom search code, and it overrides the overriden search query by ajax search pro.

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


    #4544
    Pavelescu Razvan
    Pavelescu Razvan
    Participant

    So if I use the default search page of wordpress will I it work?

    The custom field I am using is one of your fields with css and some little html structure changes, same ids, same classes names, same parameters but it is the same, is nothing new

    So now I am chaning the search page to be the wordpress’s default one. Do I have to do something else beside that?

    thanks a lot!

    #4545
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    I guess it should work, if the changes are not too major, so I don’t think you need other changes.

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


    #4547
    Pavelescu Razvan
    Pavelescu Razvan
    Participant

    “You had a custom filter enabled, which does not match anything, plus the search in posts and pages was disabled.”

    I had a custom filtre enabled which was matching the clx_event_city meta of the events. It would have shown you inpage resulsts if you would have entered in the city field “Bicaz” and searched for a “party” keyword. – so the custom filtre enabled was not the issue

    “It means that the theme already has it’s custom search code, and it overrides the overriden search query by ajax search pro.”

    I have replaced my search page with the default search page from tweetythirteen but the page doesnt have the custom postype resulsts posibility

    How can I modify the original theme search.php file to work with your plugin? or How can I modify the tweetythirteen resuslts page to display results from the custom posttype named events?

    Razvan

    #4562
    Pavelescu Razvan
    Pavelescu Razvan
    Participant

    On the clean default search page: http://www.citypoppin.com/?s=hel

    I’ve made a var_dump and I saw that the override is not working at all

    This is the select from the query:

    SELECT SQL_CALC_FOUND_ROWS wp_posts.ID FROM wp_posts WHERE 1=1 AND (((wp_posts.post_title LIKE ‘%hel%’) OR (wp_posts.post_content LIKE ‘%hel%’))) AND wp_posts.post_type IN (‘post’, ‘page’, ‘attachment’, ‘product’)…

    as you see, he does not search in the custom post types: “wp_posts.post_type IN (‘post’, ‘page’, ‘attachment’, ‘product’)”

    Also, the search custom field is not passed in the query at all.

    Any ideas?

    #4563
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    If you just refresh that page or click on the link the POST data is not sent again.

    The plugin will only override if the query is sent via the ajax search pro search box, because it needs additional POST data for the override to work correctly. Using simply a link or the default search box won’t work.

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


    #4565
    Pavelescu Razvan
    Pavelescu Razvan
    Participant

    Yes I am aware of that, I am using just the search box from another page to be redirected to the search page then inspect the var_dump

    Any thoughts?

Viewing 15 posts - 1 through 15 (of 20 total)

You must be logged in to reply to this topic.