Login Block - Add Image

Permalink Browser Info Environment
I have tried to add an image to the login block in place of the word LOGIN.

I have commented out the code to create the text 'LOGIN' with
<?php echo $this->getBlockURL() . '/create-account.jpg'; ?>


The output of this is the printed path to the image location.

/packages/login/blocks/login/create-account.jpg

Any ideas where to go from here?

if ($u->isRegistered() && $hideFormUponLogin) { ?>
   <?php    
   if (Config::get("ENABLE_USER_PROFILES")) {
      $userName = '<a href="' . $this->url('/profile') . '">' . $u->getUserName() . '</a>';
   } else {
      $userName = $u->getUserName();
   }
   ?>
   <span class="sign-in"><?php   echo t('Currently logged in as <b>%s</b>.', $userName)?> <a href="<?php   echo $this->url('/login', 'logout')?>"><?php   echo t('Sign Out')?></a></span>
<?php    } else { ?>   
   <form class="login_block_form" method="post" action="<?php    echo $loginURL?>">
      <?php     
         if($returnToSamePage ){ 
            echo $form->hidden('rcID',$c->getCollectionID());
         } ?>

Type: Discussion
Status: Archived
bgriffin
View Replies:
EvanCooper replied on at Permalink Reply
EvanCooper
I think an easier solution would probably be using a css background image for this.

As an additional note, though you are commenting it out, it might also be good to close the php tags at the bottom so there isn't html actually inside them, particularly with another open comment slash-star within it.

Let me know if this helps you get the image in there!
bgriffin replied on at Permalink Reply
bgriffin
Thanks for your reply Evan,

I will look into the css technique. Do you know if this code should produce an image output? Do you have a reference for such a css code?
<?php  $this->getBlockURL() . '/image.jpg' ;?>

Regards, B
EvanCooper replied on at Permalink Reply
EvanCooper
What I meant by the using CSS would be to include a css folder and .css file and an images folder that has your background image in your login override directory, and then just styling an element with a background image in the css file, like #loginImage { width: 200px; height: 30px; background: url(../images/awesomeLoginImage.png) no-repeat; } concrete5 will automatically pull in the css file for you.

Then throw in <div id="loginImage"></div> into your Login override view.php in the appropriate spot and you should be on your way.

Just for information's sake, here's a good thread re: getBlockURL() :
http://www.concrete5.org/community/forums/customizing_c5/does-getbl...
jamesonline replied on at Permalink Reply
jamesonline
Sorry.. I am a beginner to Concrete5. Would you mind explain this in plain English.

I want to replace current login button to customised image. Thank you!
mkly replied on at Permalink Reply
mkly
Hello,
Although this probably isn't the most modern recommended way you can instead use and image button like this

/login/view.php Line #37

Replace this
<div class="loginButton">
<?php echo $form->submit('submit', t('Sign In') . ' >')?>
</div>

With
<div class="loginButton">
<input type="image" name="submit" value="submit" src="<?php echo $this->getBlockURL() . '/create-account.jpg' border="0" height="40" width="100" />
</div>

Replace the height and the width attributes with your images height and width. I'm not positive this will look perfect, but might be worth a shot.

Best Wishes,
Mike
ConcreteCMS replied on at Permalink Reply
ConcreteCMS
Attention: Since there has been no activity on this issue for two weeks, this issue has been automatically archived.

To re-open this issue, reply to this message.

concrete5 Environment Information

Browser User-Agent String

Hide Post Content

This will replace the post content with the message: "Content has been removed by an Administrator"

Hide Content

Request Refund

You have not specified a license for this support ticket. You must have a valid license assigned to a support ticket to request a refund.