I use Drupal module Better Login. The default style is so plain. Styling is necessary to change the look of the login page. The style can be changed by modifying the css file betterlogin.css in folder /sites/all/modules/betterlogin/css
This is the example of my login page:
the betterlogin.css file:
#auth_box {
width: 300px;
margin: 0 auto;
padding: 50px 0 0;
font-family: sans-serif;
background: #0779bf ;
}
#auth_box h1#the_logo {
text-align: center;
margin: 0;
padding: 0 0 25px;
background: #48a9e4; /* #CEF6F5 ; */
box-shadow: 0 0 3px 1px #ccc;
}
#auth_box h1#the_logo img {
max-width: 250px;
color: white;
}
#auth_box h2.title {
margin: 0;
padding: 0 0 15px;
font-size: 2em;
}
#auth_box input[type="text"],
#auth_box input[type="password"] {
width: 260px;
border: 1px #ccc solid;
border-radius: 3px;
padding: 5px;
font-size: 15px;
}
#auth_box input[type="submit"] {
float: right;
}
#auth_box #middle_part {
border-radius: 3px;
/* background: #E6F810; #fff; */
background-image: -webkit-gradient(
linear,
left top,
left bottom,
color-stop(0, #4BF6FC),
color-stop(0.56, #E5F810)
);
background-image: -o-linear-gradient(bottom, #4BF6FC 0%, #E5F810 56%);
background-image: -moz-linear-gradient(bottom, #4BF6FC 0%, #E5F810 56%);
background-image: -webkit-linear-gradient(bottom, #4BF6FC 0%, #E5F810 56%);
background-image: -ms-linear-gradient(bottom, #4BF6FC 0%, #E5F810 56%);
background-image: linear-gradient(to bottom, #4BF6FC 0%, #E5F810 56%);
padding: 15px;
overflow: hidden;
box-shadow: 0 0 3px 1px #ccc;
}
#auth_box .back_link {
padding: 15px 0 0;
color: white ;
}
#auth_box #bottom_part {
font-size: 13px;
padding: 15px 0 0;
}
/* WAS */
body.html.not-front.not-logged-in.no-sidebars.page-user.page-user-login {
background: #0779bf;
}
#auth_box .password_link a {
color: white;
}
#auth_box .back_link a {
color: white ;
}
body.html.not-front.not-logged-in.no-sidebars.page-user.page-user-password {
background: #0779bf;
}
#auth_box .login_link a {
color: white;
}
div#edit-actions {
background: #E6F810;
}
Saturday, August 30, 2014
Thursday, August 28, 2014
Rename My Account to Login Username
In Drupal 7, after user login then the user menu "My Account" and "Logout" links appear at the right corner. This would be better if I can change the link "My Account" to the login username.
This is the default:
And this is what I want:
STEP 1: Open user.module file
The user.module file can be found in folder /modules/user
STEP 2: Change the code
from:
function user_menu_title() {
return user_is_logged_in() ? t('My Account') : t('User account');
}
to:
function user_menu_title() {
return user_is_logged_in() ? $GLOBALS['user']->name : t('User account');
}
another method can be found here:
This is the default:
And this is what I want:
STEP 1: Open user.module file
The user.module file can be found in folder /modules/user
STEP 2: Change the code
from:
function user_menu_title() {
return user_is_logged_in() ? t('My Account') : t('User account');
}
to:
function user_menu_title() {
return user_is_logged_in() ? $GLOBALS['user']->name : t('User account');
}
another method can be found here:
Saturday, August 9, 2014
Minbar Prayer Times in Ubuntu 14.04
I recently installed Ubuntu 14.04 replacing the old version 11.04 (not upgrading), then I did the following steps to install Minbar Prayer
a) Install Minbar Prayer Times from Ubuntu Software Center
b) Include minbar in startup program
c) Set the preference of minbar to "startup minimised to tray"
In older Ubuntu versions Minbar Prayer Times should be located on right top panel, but now it is missing. Rebooting the machine did not help.
Then I did the following steps to show the Minbar icon:
Step 1: From Ubuntu terminal (Ctrl+Alt+T), enter the command
sudo apt-add-repository ppa:gurqn/systray-trusty
Step 2: enter the command
sudo apt-get update
Step 3: enter the command
sudo apt-get upgrade
Step 4: then reboot the system by entering the command
sudo reboot
Finally the icon Minbar Prayer Time shown on top panel, and it starts (but minimised mode) every time the system starts.
Another reference related this problem can be found here.
a) Install Minbar Prayer Times from Ubuntu Software Center
b) Include minbar in startup program
c) Set the preference of minbar to "startup minimised to tray"
In older Ubuntu versions Minbar Prayer Times should be located on right top panel, but now it is missing. Rebooting the machine did not help.
Then I did the following steps to show the Minbar icon:
Step 1: From Ubuntu terminal (Ctrl+Alt+T), enter the command
sudo apt-add-repository ppa:gurqn/systray-trusty
Step 2: enter the command
sudo apt-get update
Step 3: enter the command
sudo apt-get upgrade
Step 4: then reboot the system by entering the command
sudo reboot
Finally the icon Minbar Prayer Time shown on top panel, and it starts (but minimised mode) every time the system starts.
Another reference related this problem can be found here.
Wednesday, August 6, 2014
WYSIWYG editor in Drupal 7.30
In the previous Drupal version (before 7.30), the installation of CKEditor in Drupal was not straight forward. I had to download CKEditor, saved it to the web server then modified a bit the code in CKEditor to get it worked.
Now to get WYSIWYG CKEditor editor working in Drupal 7.30 is simple. Only one module is required, and it works. The installation must be done by the administrator of the website.
This is tested in Drupal 7.30, PhP 5.3.28. The CKEditor installation result is version 4.4.3.
Step 1: Go to Module menu
Once the installation completed, select Enable newly added modules
Make sure you enable it, by clicking the selection box
Now to get WYSIWYG CKEditor editor working in Drupal 7.30 is simple. Only one module is required, and it works. The installation must be done by the administrator of the website.
This is tested in Drupal 7.30, PhP 5.3.28. The CKEditor installation result is version 4.4.3.
Step 1: Go to Module menu
Step 2: Then select Install new module
Step 3: Get the CKEditor module
Go to the project website https://www.drupal.org/project/ckeditor , then copy the module link location
Step 4: Paste the link to the installation
Step 5: Enable CKEditor module
then don't forget to save the configuration (at the bottom of the page)
Step 6: If you create a node, the editor is now equipped with the WYSIWYG tools.
Subscribe to:
Posts (Atom)