SEARCH page in French

pideja · 2020-02-19 06:41:44

Hello, I'm trying to introduce a search function on my site (pideja.ca) but I can't find where to translate the text on that page. Further, is there a way to customize the look of that page?

Merci!

pideja · 2020-02-19 07:03:13

Regarding the design of the search result page, this is what I have in mind:

Preliminary tests show that the search engine works well with single keywords, not so much with full name and surname. But I am hopeful that I will find a way to refine the search results.

Daniel Leu · 2020-02-19 07:30:36

Works well with full names too. Just put them in quotes: "MICHEL BEAULIEU". If you want matching images, you need to enhance the caption and keywords. There is more about using search in http://backlight.theturninggate.net/doc … t_s_search

Language customization is part of the Publisher section in Backlight > Admin > Settings > Languages. In order to see changes, you might need to logout from Backlight admin and login again.

rod barbee · 2020-02-19 08:10:58

pideja wrote:

Hello, I'm trying to introduce a search function on my site (pideja.ca) but I can't find where to translate the text on that page. Further, is there a way to customize the look of that page?
Merci!

You can customize the look by assigning an album template that has the design you want.
(assign the search page album template in Backlight Settings > Publisher: Search Template)

Further from that, you can always use custom css.

If you want to target only the search page with custom css, first create an album template specifically for the search page and give it the Identifier of "search".

The search page will then have a body class named: "album-template-identifier-search" and you can use that to confine any css you write to that page.

pideja · 2020-02-19 21:27:46

Daniel wrote:

Language customization is part of the Publisher section in Backlight > Admin > Settings > Languages. In order to see changes, you might need to logout from Backlight admin and login again.

Done that but nothing changes.

Last edited by pideja (2020-02-19 21:55:42)

pideja · 2020-02-19 21:39:08

Rod wrote:

You can customize the look by assigning an album template that has the design you want.
(assign the search page album template in Backlight Settings > Publisher: Search Template)

I created an album named "Search" with "search" as the identifier.
In Publisher, this album does not appear. What went wrong?

Last edited by pideja (2020-02-19 21:52:07)

pideja · 2020-02-19 22:09:32

Trying to translate:

Enter search, then press Return...

by entering

<input type="text" id="q" name="q" value="" placeholder="Entrer votre recherche, puis cliquer la loupe...">

in Backlight>PublisheGallerieRECHERCHE>Edit Album>page content>Main Copy but alas, doesn't do anything.

pideja · 2020-02-19 22:24:10

Still in styling the SEARCH, is there a way to place the search button under the top palette? As it is now, it look ok on the large desktop but down on the phone, the search button overlaps the menu button!

If not I'm left with having the menu in the header...

Last edited by pideja (2020-02-19 22:38:49)

rod barbee · 2020-02-19 22:37:26

pideja wrote:

Rod wrote:
You can customize the look by assigning an album template that has the design you want.
(assign the search page album template in Backlight Settings > Publisher: Search Template)
I created an album named "Search" with "search" as the identifier.
In Publisher, this album does not appear. What went wrong?

You need to create an album template, not an album
Then assign this template as the Search template in Backlight Settings.

pideja · 2020-02-19 22:48:13

The SEARCH template is in the ALBUM TEMPLATES in BACKLIGHT. It shows up in the Publisher>Albums section.
But ( I must be having a brain cramp) I can't figure out how to assign the page as the SEARCH template nor how to change the design...

rod barbee · 2020-02-19 22:55:22

You don’t need to assign it to any album.
Go to Backligh > Settings > Publisher.
Enter the template name in the Search Template field

The way you change the design is by changing the design of the Page Template that’s assigned to the Search album template.

Beyond that, use custom css

pideja · 2020-02-19 23:58:53

I entered the template name (Search) in the Search Template field.
Being in the ALBUM TEMPLATES there are no settings to change there.
In the PAGE template, the only setting I can see is to switch the Search on or off but in the top palette only.
The main design problem is that being in the top palette, the menu button tends to overlap the search button. I should look into either a specific mobile query for either of these buttons or place the search and menu on opposite sides, with the nameplate either in the header or centred in the top palette.

As for the search box translation, I've looked over the languages section, changed all relevant entries but still no French in the search box.

rod barbee · 2020-02-20 00:09:48

The search button issue is a site wide issue. I thought you were asking about making design changes unique to the search page.
Like colors, text alignment, etc.

pideja · 2020-02-20 00:28:56

For the moment I settled on placing the search button to the left with the nameplate in the center. Not what I want, ultimately, but it is going to be that for a while, 'til I decide and find out how to design as I want it.

I'm sure the syntax is wrong, but surprisingly, when I write it this way (based on how the inspector describes it):

.fb-search #search {
    background-color: #393939;
    border-radius: 0;
    margin: 0 auto;
    max-width: none;
    position: relative;
    width: 100%;
    height: 100%;
}

it does work! The base color of the page went black.

Now, to get that search form translated...

Last edited by pideja (2020-02-20 00:34:56)

rod barbee · 2020-02-20 01:08:31

It appears that the placeholder text is actually a part of the page; I don't see anything in the Language section that covers it. I found a way to change it using jQuery though.

Add this to the scripts hook in your phplugins file, substituting "new placeholder text" for your own:

<script>
  jQuery(document).ready(function($){
  $(\'#search form\').find("input[type=text]").each(function(ev)
  {
      if(!$(this).val()) {
     $(this).attr("placeholder", "new placeholder text");
  }
  });
});
  </script>

pideja · 2020-02-20 01:37:48

If I use that code, I get:

Unexpected error: syntax error, unexpected '<', expecting function (T_FUNCTION) or const (T_CONST) in pangolin-pideja.php on line 45

If I comment line 45, I get

Unexpected error: syntax error, unexpected 'jQuery' (T_STRING), expecting function (T_FUNCTION) or const (T_CONST) in pangolin-pideja.php on line 46

In all cases, I can't access the site.

rod barbee · 2020-02-20 02:24:24

There's a syntax error some place. Are you placing the code in the scripts hook with an echo statement?
Can you post your phplugins code?

pideja · 2020-02-20 03:06:45

Here it is:

<?php

function user_load($style, $path) {
  $g_tsvrl = explode(' ', $style); // Extract gallery type
  define ('G_STYLE', strtoupper($g_tsvrl[1])); // and set global for later
  $g_path = str_ireplace('\\','/',$path); // change \ to /
  $chunks = explode('/',$g_path); // and put into array
  define ('G_PATH', strtoupper($chunks[count($chunks)-2])); // gallery folder name is second to last
  //define ( 'TTG_SITE', ''); // set new site root for navigation, resources, etc.
}

if (defined('BACKLIGHT_HOOK')) {
	require_once(realpath(BACKLIGHT_HOOK).'/modules/module-designer/application/helpers/APHPlugins.php');
}

class PHPlugins extends APHPlugins
{

/* KABEL font */

function head() {
echo '
<link rel="stylesheet" type="text/css" href="pideja.css">
';
}

/* Replace the mobile menu icon with the word "Menu" */

function scripts () {
echo'
<script>$(".page__toggle__buttons label ul").replaceWith("<p>Menu</p>");</script>
';
}
/* Display the logo in pallet_top */

function pallet_top_title () {
  echo '

  <li class="top-pallet-logo"><a href="/"></a></li>

  ';
  return false;
}
/* search page placeholder text translation */

<script>
 jQuery(document).ready(function($){
 $(\'#search form\').find("input[type=text]").each(function(ev)
 {
     if(!$(this).val()) {
    $(this).attr("placeholder", "new placeholder text");
 }
 });
});
 </script>

} ?>

I place the faulty code at the very end...

rod barbee · 2020-02-20 03:09:19

looks like it's working now. You must have corrected the syntax error (closing the echo before the new code). I see different placeholder text, ending in ...AAA

off topic...but you don't need to add a link to custom css in the head. particularly as that link goes nowhere.

pideja · 2020-02-20 03:29:39

Sorry, but it does not work here! I commented the whole section in order to continue working on the site.

As for the AAA, I just wrote that in the inspector in order to test the change.
In the inspector, the text is here:

<input type="text" id="q" name="q" value="" placeholder="Enter search, then press Return...">

As for the CSS link, do you mean this:

/* KABEL font */

function head() {
echo '
<link rel="stylesheet" type="text/css" href="pideja.css">
';
}

I commented it all.

Last edited by pideja (2020-02-20 03:42:58)

rod barbee · 2020-02-20 03:43:08

Anything you do in the inspector should not visible by visitors. Can you remove it from the inspector?

As to the CSS, yes, that's the code I mean.

rod barbee · 2020-02-20 03:45:31

If it's not working when you enable it in phplugins, it's probably because of that syntax error I mentioned. You initially put the code outside of the echo in the script hook.

Make sure you place the code in the script hook. As you have it above, it's coming after the closing of the pallet_top_title hook.

Insert the code directly after the other script (the replace menu icon script)

rod barbee · 2020-02-20 03:53:50

it should look like this:

/* Replace the mobile menu icon with the word "Menu" */

function scripts () {
echo'
<script>$(".page__toggle__buttons label ul").replaceWith("<p>Menu</p>");</script>

/* search page placeholder text translation */
<script>
 jQuery(document).ready(function($){
 $(\'#search form\').find("input[type=text]").each(function(ev)
 {
     if(!$(this).val()) {
    $(this).attr("placeholder", "new placeholder text");
 }
 });
});
 </script>
';
}

/* Display the logo in pallet_top */

function pallet_top_title () {
  echo '

  <li class="top-pallet-logo"><a href="/"></a></li>

  ';
  return false;
}

pideja · 2020-02-20 04:10:55

Thanks a million, Rod.

It's easy for me to get confused in the CSS or php scripts...

rod barbee · 2020-02-20 04:31:39

It took me a little bit of fiddling to get it to work.

Now watch Matt come along with something super easy.....

Community @ The Turning Gate

#1 2020-02-19 06:41:44

SEARCH page in French

#2 2020-02-19 07:03:13

Re: SEARCH page in French

#3 2020-02-19 07:30:36

Re: SEARCH page in French

#4 2020-02-19 08:10:58

Re: SEARCH page in French

#5 2020-02-19 21:27:46

Re: SEARCH page in French

#6 2020-02-19 21:39:08

Re: SEARCH page in French

#7 2020-02-19 22:09:32

Re: SEARCH page in French

#8 2020-02-19 22:24:10

Re: SEARCH page in French

#9 2020-02-19 22:37:26

Re: SEARCH page in French

#10 2020-02-19 22:48:13

Re: SEARCH page in French

#11 2020-02-19 22:55:22

Re: SEARCH page in French

#12 2020-02-19 23:58:53

Re: SEARCH page in French

#13 2020-02-20 00:09:48

Re: SEARCH page in French

#14 2020-02-20 00:28:56

Re: SEARCH page in French

#15 2020-02-20 01:08:31

Re: SEARCH page in French

#16 2020-02-20 01:37:48

Re: SEARCH page in French

#17 2020-02-20 02:24:24

Re: SEARCH page in French

#18 2020-02-20 03:06:45

Re: SEARCH page in French

#19 2020-02-20 03:09:19

Re: SEARCH page in French

#20 2020-02-20 03:29:39

Re: SEARCH page in French

#21 2020-02-20 03:43:08

Re: SEARCH page in French

#22 2020-02-20 03:45:31

Re: SEARCH page in French

#23 2020-02-20 03:53:50

Re: SEARCH page in French

#24 2020-02-20 04:10:55

Re: SEARCH page in French

#25 2020-02-20 04:31:39

Re: SEARCH page in French

Board footer