Mysidia Adoptables Support Forum

Mysidia Adoptables Support Forum (http://www.mysidiaadoptables.com/forum/index.php)
-   Questions and Supports (http://www.mysidiaadoptables.com/forum/forumdisplay.php?f=18)
-   -   How to add a logo to your site?! (http://www.mysidiaadoptables.com/forum/showthread.php?t=5563)

goofyunicorn 04-03-2018 12:31 PM

How to add a logo to your site?!
 
How do I add a logo to my site? :)

Dinocanid 04-03-2018 12:41 PM

Go to templates->your theme->template.tpl. In there is where you can place a logo for your site with regular html, like this:
HTML Code:

<a href='/index'><img src="IMAGE_URL"></a>
Depending on what theme you use, you might have to change it through the css instead.

goofyunicorn 04-03-2018 12:55 PM

Quote:

Originally Posted by Dinocanid (Post 37067)
Go to templates->your theme->template.tpl. In there is where you can place a logo for your site with regular html, like this:
HTML Code:

<a href='/index'><img src="IMAGE_URL"></a>
Depending on what theme you use, you might have to change it through the css instead.


Thank you!

Also, while your here, do you have any experience of making themes from scratch?!

Dinocanid 04-03-2018 01:00 PM

Quote:

Originally Posted by goofyunicorn (Post 37068)
Thank you!

Also, while your here, do you have any experience of making themes from scratch?!

I've made themes from scratch before, but I wouldn't say I'm very good at it :S
I would consider this one to be my best yet, but it's still pretty simple:

goofyunicorn 04-03-2018 01:05 PM

Quote:

Originally Posted by Dinocanid (Post 37067)
Go to templates->your theme->template.tpl. In there is where you can place a logo for your site with regular html, like this:
HTML Code:

<a href='/index'><img src="IMAGE_URL"></a>
Depending on what theme you use, you might have to change it through the css instead.

What line should I place it on for the Main theme? Just at the end?

goofyunicorn 04-03-2018 01:06 PM

Quote:

Originally Posted by Dinocanid (Post 37069)
I've made themes from scratch before, but I wouldn't say I'm very good at it :S
I would consider this one to be my best yet, but it's still pretty simple:

That's actually really lovely. Would you want to be paid if I were to ask for you to make me a theme?

Dinocanid 04-03-2018 01:17 PM

Quote:

Originally Posted by goofyunicorn (Post 37070)
What line should I place it on for the Main theme? Just at the end?

It should go above {$menu} so it will show at the top, since it would show at the bottom if you placed it at the end. Since it looks like you're using the main theme, you would have to go into the "media" subfolder and edit this in style-city.css instead:

Code:

#image {
border-left:10px solid #fff;
border-right:10px solid #fff;
border-bottom:5px solid #fff;
background:url("citylights.jpg") left no-repeat #91C7F5;
height:150px;
}

Replace citylight.jpg with your logo. In the event that your theme doesn't have "#image" in the css, then you would edit the template.tpl.

Quote:

Originally Posted by goofyunicorn (Post 37071)
That's actually really lovely. Would you want to be paid if I were to ask for you to make me a theme?

Yeah, since it takes time to get things to look right depending on how complex it is.

goofyunicorn 04-03-2018 01:22 PM

Quote:

Originally Posted by Dinocanid (Post 37072)
It should go above {$menu} so it will show at the top, since it would show at the bottom if you placed it at the end. Since it looks like you're using the main theme, you would have to go into the "media" subfolder and edit this in style-city.css instead:

Code:

#image {
border-left:10px solid #fff;
border-right:10px solid #fff;
border-bottom:5px solid #fff;
background:url("citylights.jpg") left no-repeat #91C7F5;
height:150px;
}

Replace citylight.jpg with your logo. In the event that your theme doesn't have "#image" in the css, then you would edit the template.tpl.


Yeah, since it takes time to get things to look right depending on how complex it is.


How much would you be looking for or how could I make my own theme?

goofyunicorn 04-03-2018 01:29 PM

Quote:

Originally Posted by Dinocanid (Post 37072)
It should go above {$menu} so it will show at the top, since it would show at the bottom if you placed it at the end. Since it looks like you're using the main theme, you would have to go into the "media" subfolder and edit this in style-city.css instead:

Code:

#image {
border-left:10px solid #fff;
border-right:10px solid #fff;
border-bottom:5px solid #fff;
background:url("citylights.jpg") left no-repeat #91C7F5;
height:150px;
}

Replace citylight.jpg with your logo. In the event that your theme doesn't have "#image" in the css, then you would edit the template.tpl.


Yeah, since it takes time to get things to look right depending on how complex it is.


It isn't displaying on the website?
I put this in:

PHP Code:

#image {
border-left:10px solid #fff;
border-right:10px solid #fff;
border-bottom:5px solid #fff;
background:url("Logo.png"left no-repeat #91C7F5;
height:150px;



Dinocanid 04-03-2018 01:41 PM

Quote:

Originally Posted by goofyunicorn (Post 37073)
How much would you be looking for or how could I make my own theme?

$10 maybe? You could also make your own theme like this:
  • Create a new subfolder inside "templates" and name it whatever you want (I don't recommend names with spaces)
  • Create 3 new files: header.tpl, style.css, template.tpl. Inside header.tpl, paste this and save it:
    HTML Code:

    <html>
    <head>
    {$header->loadFavicon("{$home}favicon.ico")}
    {$header->loadStyle("{$home}{$temp}{$theme}/media/style.css")}
    {$header->loadStyle("{$home}{$css}/menu.css")}
    {$header->loadAdditionalStyle()}
    <!--[if lte IE 6]>
    {$header->loadStyle("{$home}{$css}/media/dropdown_ie.css")}
    <![endif]-->

    </head>

    For style.css, you could start off by copying the code from style-city.css and adjusting stuff how you like.
  • Inside template.tpl is where most of the layout goes. You can arrange where you want things to go with HTML in here. {$document_title} shows the title of whatever page you're on, {$document_content} shows the page content, {$menu} shows the dropdown menu, etc.
    It is also possible to add your own menu from scratch instead of using {$menu} (which I personally find easier). Here is an example of one I made with Bootstrap:
    HTML Code:

    <nav class="nav nav-fill" style="background-color: #0f0f0f; width:900px; font-family:'Bubblegum Sans', cursive; font-size:100%;">
      {if $logged_in} 
      <a class="nav-item nav-link active" href="/exploring" style="font-size:16px;"><i class="far fa-compass"></i> Explore</a>
      <a class="nav-item nav-link active" href="/tasklist" style="font-size:16px;"><i class="fas fa-paw"></i> Quests</a>
      {/if}
      <a class="nav-item nav-link active" href="/wiki" style="font-size:16px;"><i class="fas fa-book"></i> Wiki</a>
      <a class="nav-item nav-link active" href="http://wild-souls-game.proboards.com/" style="font-size:16px;"><i class="fas fa-users"></i> Forum</a>
    </nav>

  • Go to the adminCP and click "add new theme". Only fill in the first 2 fields (folder name must be the same as the one you created), and click the checkbox before submitting. Now you should be able to try it out at "yoursite.com/changestyle"


All times are GMT -5. The time now is 04:58 AM.

Powered by vBulletin® Version 3.8.11
Copyright ©2000 - 2024, vBulletin Solutions Inc.