Jump to content


Photo
- - - - -

How to place a dropdown login box in a page


  • Please log in to reply
18 replies to this topic

#1 grahamd79

grahamd79

    Advanced Member

  • Members

  • 56 posts
  • Country: Country Flag

Posted 25 April 2012 - 05:11 AM

Hi, I am new to pagelines but doing well to learn it. My question is, I need something like

Please Login or Register to see this Hidden Content

to be placed on my custom pagelines page on a certain area. I have its HTML, CSS & Jquery but don't know how to place it and where to keep the jquery code etc. I need it the help step by step. Will really appreciate it. Thanks, Farhan

#2 Danny

Danny

    Is Awesome!

  • Moderators
  • 16897 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 25 April 2012 - 08:13 AM

Hi Farhan, First you would need to place the Jquery code into the Settings > Custom Code > Header Scripts area. Then add the HTML to a hook and the CSS to either your child themes style.css or to the PageLines Customisation plug-ins style.css. In order to find the correct location, use the Action Map plug-in from the PageLines store.

#3 grahamd79

grahamd79

    Advanced Member

  • Members

  • 56 posts
  • Country: Country Flag

Posted 25 April 2012 - 11:01 AM

Thanks for your response. But what are Hooks...not sure about it...and how to add them?

#4 Danny

Danny

    Is Awesome!

  • Moderators
  • 16897 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 25 April 2012 - 12:50 PM

Using hooks is pretty easy once you try it out. To learn about them in detail, please refer to this

Please Login or Register to see this Hidden Content

s doc on WordPress.org.

There are instructions, including an example filter already placed in the child themes and PageLines Customisation plug-ins functions.php file. I have added the basic instructions below.

Please Login or Register to see this Hidden Content



#5 grahamd79

grahamd79

    Advanced Member

  • Members

  • 56 posts
  • Country: Country Flag

Posted 26 April 2012 - 01:56 PM

I want a login box (as seen on the below image) on the top right side of the site www.trendorg.co.uk How will I put its HTMl ?...with hooks i understand we can put define functions but how to put html tags on specific location of a page.

#6 Jenny

Jenny

    Advocate

  • Unicorn Store Dev

  • 2924 posts
  • LocationWV
  • Country: Country Flag

Posted 26 April 2012 - 05:36 PM

You put the HTML inside your function, like:

Please Login or Register to see this Hidden Content



#7 grahamd79

grahamd79

    Advanced Member

  • Members

  • 56 posts
  • Country: Country Flag

Posted 01 May 2012 - 05:17 PM

Still not sure about the placement of my html code in my pagelines website: - I have added the jquery header script in code in Settings > Custom Code > Header scripts - Added its CSS in pagelines-customize/style.css - Now how and where should I add this html code: ----------------------

Please Login or Register to see this Hidden Content

Please Login or Register to see this Hidden Content

---------------- Please guide me step by step.

#8 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 01 May 2012 - 07:26 PM

Everything you have after "" and before "" goes where simple_mama said "Your html goes here" Make sure you have a specific div created just as simple_mama pointed out in "
" so that specific CSS may be applied to it.

#9 grahamd79

grahamd79

    Advanced Member

  • Members

  • 56 posts
  • Country: Country Flag

Posted 01 May 2012 - 08:09 PM

and where should this go? I mean which file in pagelines?

add_action('the_hook_name', 'your_function_name');
function your_function_name() {
?>
Your html goes here
}


--P.S. please also confirm if the above code is correct?...i am not sure about the question mark and greater than sign after function your_function_name() { and after
Your html goes here


#10 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 01 May 2012 - 08:41 PM

You really need to read the section on hooks and customization in the Docs.

Please Login or Register to see this Hidden Content

Okay, a hook is a piece of the actual functions code - the stuff that makes PageLines work. Thus, it's part of a PHP script, therefore, to enable the hook, which is outside the PHP script, you have to end the PHP function, then, when the hook is finished, restart PHP functions so the rest of the site can proceed. If not, the site will break. Most people who make errors with hooks do so with this issue. You need to know the hook name you're going to use. To find that, you need the Action Map plugin which shows you where things go. Here's a list of possible hooks:

Please Login or Register to see this Hidden Content

Essentially your_hook_name is the hook you're going to use. If you're totally uncomfortable with this, I'd strongly suggest you seek a quote from one of our Pros via

Please Login or Register to see this Hidden Content

Hooks are not difficult, but it's not advisable to attempt them without reading the documentation thoroughly. After all, you wouldn't want your surgeon performing an appendectomy after watching an episode of E.R. You'd kinda hope he's studied it.

#11 grahamd79

grahamd79

    Advanced Member

  • Members

  • 56 posts
  • Country: Country Flag

Posted 02 May 2012 - 02:21 PM

Thanks...worked fine now...but suddenly I figured out one issue, that my quickslider is not working on the page when I insert the following line in headerscript section



when I remove the script initialization from the headerscript, the quickslider banner works again. But my login box doesn't works.

Please let me know what's wrong.

Thanks,
Farhan

#12 Jenny

Jenny

    Advocate

  • Unicorn Store Dev

  • 2924 posts
  • LocationWV
  • Country: Country Flag

Posted 02 May 2012 - 03:10 PM

Try moving the script to the function itself, like below the . Note: I have not tested this. Try at your own risk. ;)

#13 grahamd79

grahamd79

    Advanced Member

  • Members

  • 56 posts
  • Country: Country Flag

Posted 02 May 2012 - 03:32 PM

still didn't work...maybe quickslider is conflicting somewhere.

#14 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 02 May 2012 - 06:55 PM

The quickslider is using a different jQuery and it's possible the two conflict with each other.

#15 grahamd79

grahamd79

    Advanced Member

  • Members

  • 56 posts
  • Country: Country Flag

Posted 03 May 2012 - 04:36 AM

I removed my jQuery (for login box) from the headerscript section and the banner arrives back but the login box doesn't works. what's the solution, so both start working.

#16 grahamd79

grahamd79

    Advanced Member

  • Members

  • 56 posts
  • Country: Country Flag

Posted 03 May 2012 - 06:05 AM

basically login box = Click to call back box.

#17 Danny

Danny

    Is Awesome!

  • Moderators
  • 16897 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 03 May 2012 - 10:17 AM

Hi Graham, I think the best course of action would be for you to contact one of the PageLines Pros and see if they can assist you.

Please Login or Register to see this Hidden Content



#18 grahamd79

grahamd79

    Advanced Member

  • Members

  • 56 posts
  • Country: Country Flag

Posted 03 May 2012 - 06:33 PM

well I am low on budget and cannot pay the Pros for support. Please let me know in which file the Quickslider's jquery script declaration is done? as we do in headerscript section.

#19 catrina

catrina

    Advocate

  • Members
  • 12345 posts
  • LocationCalifornia
  • Country: Country Flag

Posted 04 May 2012 - 02:07 AM

If you like in the plugin folder for Quickslider using an FTP client, there should be js files for the plugin, however caution must be taken in making modifications.