Background Image

All installation and configuration problems and questions

Moderators: gerski, enjay, williamconley, Op3r, Staydog, gardo, mflorell, MJCoate, mcargile, Kumba, Michael_N

Background Image

Postby hansg » Fri Oct 12, 2018 7:51 am

Hi,

I know this isn't strictly vicidial related but...

I am trying to add a simple generic background image to the agent.php page. I want the image to be fullscreen behind the login box. I have tried a couple of methods but html/php is not my strong point.

Could someone give me a bit of help with this please?
Dual Core - 4GB DDR3 - 80GB SSD
Vicibox 9
VERSION: 2.14-751a
BUILD: 200425-0949
SSL Installed
hansg
 
Posts: 129
Joined: Wed May 11, 2016 8:56 pm

Re: Background Image

Postby williamconley » Sun Oct 14, 2018 11:56 am

1) you didn't post your installer with version.

2) Vicidial doesn't have an agent.php page, it has a vicidial.php page, thus the requirement for your installation method.

3) In Vicidial:

In /srv/www/htdocs/agc/vicidial.php there are many instances of "<body onresize", each one represents a different method of drawing the page. One for "relogin", one for "if agent login is first instead of phone login", etc.

For instance, this will result in a ... very interesting "relogin" page (this is the page the agents are sent to when they log out, offering a pre-filled-in form for relogin, handy to bookmark for simplistic workstation login):
Code: Select all
nano +1160 /srv/www/htdocs/agc/vicidial.php

if ($relogin == 'YES')
        {
        echo "<title>"._QXZ("Agent web client: Re-Login")."</title>\n";
        echo "</head>\n";
    echo "<body onresize=\"browser_dimensions();\" onload=\"browser_dimensions();\" style='background-image:url(\"./images/vicidial_admin_web_logo.png\");'>\n";

The only change to the code is the style of the <body tag.

4) This is a support request not a General Discussion. Moving to the proper board.
Vicidial Installation and Repair, plus Hosting and Colocation
Newest Product: Vicidial Agent Only Beep - Beta
http://www.PoundTeam.com # 352-269-0000 # +44(203) 769-2294
williamconley
 
Posts: 20018
Joined: Wed Oct 31, 2007 4:17 pm
Location: Davenport, FL (By Disney!)

Re: Background Image

Postby hansg » Mon Oct 15, 2018 4:56 am

Thanks William.

Don't know where I got agent.php from, I knew it was vicidial.php

Thanks for the info on that though, got it working. I am just playing around a little bit to possibly make it look a little different.
Dual Core - 4GB DDR3 - 80GB SSD
Vicibox 9
VERSION: 2.14-751a
BUILD: 200425-0949
SSL Installed
hansg
 
Posts: 129
Joined: Wed May 11, 2016 8:56 pm

Re: Background Image

Postby hansg » Wed Oct 17, 2018 6:28 am

I have the background image displaying now.

Only problem I have is trying to have the background adjust to different screen resolutions/sizes. I have tried a few different methods to make it the correct size but the image either multiplies if the screen resolution is bigger than the image or it shows part of the image if the resolution is less.

I'm probably doing something stupid. How can I change this to adjust properly?

Code: Select all
echo "<title>"._QXZ("Agent web client: Re-Login")."</title>\n";
        echo "</head>\n";
    echo "<body onresize=\"browser_dimensions();\" onload=\"browser_dimensions();\" style='background-image:url(\"./images/background_image.jpg");'>\n";
Dual Core - 4GB DDR3 - 80GB SSD
Vicibox 9
VERSION: 2.14-751a
BUILD: 200425-0949
SSL Installed
hansg
 
Posts: 129
Joined: Wed May 11, 2016 8:56 pm

Re: Background Image

Postby blackbird2306 » Wed Oct 17, 2018 8:56 am

Try it with:
Code: Select all
echo "<body onresize=\"browser_dimensions();\" onload=\"browser_dimensions();\" style='background-image:url(\"./images/vicidial_admin_web_logo.png\"); background-repeat: no-repeat; background-position: left; background-size: auto;'>\n";

and change the property values according to your wishes:
background-position:
left top
left center
left bottom
right top
right center
right bottom
center top
center center
center bottom
https://www.w3schools.com/cssref/pr_background-position.asp

background-size:
auto, cover ...
https://www.w3schools.com/cssref/css3_pr_background-size.asp

And there would be no harm in taking a look at the CSS basics (very useful for your purpose changing vicidial design).
https://www.w3schools.com/css/default.asp
Vicibox 6.0.2 from Vicibox_v.6.0.x86_64-6.0.2.iso | Vicidial 2.12-560a build: 160617-1427 | Asterisk 1.8.32.3
blackbird2306
 
Posts: 409
Joined: Mon Jun 23, 2014 5:31 pm


Return to Support

Who is online

Users browsing this forum: Bing [Bot] and 93 guests