Advertisement:

Author Topic: need a little help with a search form icon  (Read 244 times)

Valdo

  • Newbie
  • *
  • Posts: 15
need a little help with a search form icon
« on: June 04, 2019, 12:28:31 am »
I have tried using class tags
<label for="stuff" class="fa fa-search "></label>
Does not work

Code: [Select]
<div class="top">
        <div class="large">
          <div class="b1">
            <div class="label"><?php _e('What are you looking for?''veronika'); ?></div>
            <div class="box">
              <?php if (osc_get_preference('item_ajax''veronika_theme') == 1) { ?>
                <div id="item-picker">
                  <input type="text" name="sPattern" class="pattern" placeholder="<?php _e('Samsung S7 Edge...''veronika'); ?>" value="<?php echo Params::getParam('sPattern'); ?>" autocomplete="off"/>

BritWeb

  • Hero Member
  • *****
  • Posts: 770
  • If it ain't broke, don't fix it.
Re: need a little help with a search form icon
« Reply #1 on: June 04, 2019, 06:12:18 pm »
I understand you need to place a search icon in the input field; do the following

  • Open your theme's 'style.css'
  • Locate the section, '/* ITEM PICKER */'
  • Put the line, #item-picker:after {font-family:"FontAwesome";position:absolute;color:#777;left:14px;top:10px;font-size:25px;content:"\f002";font-weight:500;} below the line, #item-picker {position:relative;float:left;width:100%;z-index:10}
  • Save the file and clear the cache / refresh your browser and you will see the search icon in the input field

See the pic attached showing the required section on your 'style.css'.

Cheers!

Valdo

  • Newbie
  • *
  • Posts: 15
Re: need a little help with a search form icon
« Reply #2 on: June 08, 2019, 04:51:50 am »
Hello BritWeb

Work with a little problem
I have done it according to your instructions

But the position of the icon is above the placehoder
can you provide a solution for this?

thank you

Regards

BritWeb

  • Hero Member
  • *****
  • Posts: 770
  • If it ain't broke, don't fix it.
Re: need a little help with a search form icon
« Reply #3 on: June 08, 2019, 12:40:26 pm »
Hello BritWeb

Work with a little problem
I have done it according to your instructions

But the position of the icon is above the placehoder
can you provide a solution for this?

thank you

Regards

Hi

I don't have that theme on me to test and I just had a look at the css file at the developer's site and suggested you the changes.

Nevertheless, it's a question of playing with the 'style.css' file. Place the following line of code below the one you have just added
on the style.css file and let us know how you got on.

Code: [Select]
#item-picker .shower {float:left;clear:both;width:100%;position:relative;padding-left:25px;}
 Cheers!


Valdo

  • Newbie
  • *
  • Posts: 15
Re: need a little help with a search form icon
« Reply #4 on: June 26, 2019, 12:49:05 am »
hello BritWeb

thank you

I have tried still not working, there are other suggestions that you can help me

Regards

BritWeb

  • Hero Member
  • *****
  • Posts: 770
  • If it ain't broke, don't fix it.
Re: need a little help with a search form icon
« Reply #5 on: June 26, 2019, 01:51:22 pm »
hello BritWeb

thank you

I have tried still not working, there are other suggestions that you can help me

Regards

That line of code should work. As I said I don't have that theme on me to troubleshoot.

Regards


Valdo

  • Newbie
  • *
  • Posts: 15
Re: need a little help with a search form icon
« Reply #6 on: June 26, 2019, 10:31:06 pm »
Problem solved

Thank you BritWeb

I have found that point

Regards