Added option to edit buttons on home page

/*
    |--------------------------------------------------------------------------
    | Custom Buttons on Home Page
    |--------------------------------------------------------------------------
    |
    | Here you can configure your own buttons for the Home Page.
    | You can add or remove as many buttons as you like.
    |
    | The syntax of the custom buttons is as follows:
    |
    |       array(
    |         'button' => '',
    |         'link' => '',
    |         'title' => '',
    |         'icon' => '',
    |         'custom_css' => ''
    |       ),
    |
    | In the 'button' field, you have to enter the button name (i.e. 'twitter', 'github', 'custom'...).
    | You can find a list of all available buttons below.
    |
    | In the 'link' field, can enter your desired link you can leave this field empty for a display only, non-functional button.
    |
    |
    |
    | The input fields below only apply to buttons such as 'custom' and 'custom_website' but must always be included even if only empty.
    |~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    |
    | In the 'title' field, changes the text on a button, such as 'custom' and 'custom_website'.
    |
    | In the 'icon' field, uses the same syntax as the Button Editor on the Admin Panel.
    | This allows you to add your own icons to 'custom' buttons. You can find a list of available icons on llc.bio/fa.
    |
    | In the 'custom_css' field, here you can enter custom CSS to change the color of your button.
    | If you don't feel comfortable working with CSS,
    | you can copy and paste the CSS from the 'Custom CSS' field of the Button Editor on the Admin Panel.
    |
    */

    'use_custom_buttons'  => 'true', // Set this to false if you wish to display the old buttons.

    'buttons' => array(
      array(
        'button' => 'github',
        'link' => 'https://github.com/JulianPrieber/littlelink-custom',
        'title' => '',
        'icon' => '',
        'custom_css' => ''
      ),
      array(
          'button' => 'custom',
          'link' => 'https://littlelink-custom.com',
          'title' => 'Project Website',
          'icon' => 'llc',
          'custom_css' => 'color:#ffffff; background-image:linear-gradient(76deg, #f70fff 0%, #11d4de 100%);'),
      array(
        'button' => 'custom',
        'link' => 'https://littlelink-custom.com/sponsor',
        'title' => 'Help us out',
        'icon' => 'fa-hand-holding-hand',
        'custom_css' => 'color:#ffffff; background-image:radial-gradient(circle, #00d2ff 0%, #3a7bd5 95%);'
      ),
    )

    /*
    |--------------------------------|
    | List of Available buttons:     |
    |--------------------------------|
    | 'button' => 'custom'           |
    | 'button' => 'custom_website'   |
    | 'button' => 'github'           |
    | 'button' => 'twitter'          |
    | 'button' => 'instagram'        |
    | 'button' => 'facebook'         |
    | 'button' => 'messenger'        |
    | 'button' => 'linkedin'         |
    | 'button' => 'youtube'          |
    | 'button' => 'discord'          |
    | 'button' => 'twitch'           |
    | 'button' => 'snapchat'         |
    | 'button' => 'spotify'          |
    | 'button' => 'reddit'           |
    | 'button' => 'medium'           |
    | 'button' => 'pinterest'        |
    | 'button' => 'soundcloud'       |
    | 'button' => 'figma'            |
    | 'button' => 'kit'              |
    | 'button' => 'telegram'         |
    | 'button' => 'tumblr'           |
    | 'button' => 'steam'            |
    | 'button' => 'vimeo'            |
    | 'button' => 'wordpress'        |
    | 'button' => 'goodreads'        |
    | 'button' => 'skoob'            |
    | 'button' => 'tiktok'           |
    | 'button' => 'default email'    |
    | 'button' => 'default email_alt'|
    | 'button' => 'bandcamp'         |
    | 'button' => 'patreon'          |
    | 'button' => 'signal'           |
    | 'button' => 'venmo'            |
    | 'button' => 'cashapp'          |
    | 'button' => 'gitlab'           |
    | 'button' => 'mastodon'         |
    | 'button' => 'paypal'           |
    | 'button' => 'whatsapp'         |
    | 'button' => 'xing'             |
    | 'button' => 'buy me a coffee'  |
    | 'button' => 'website'          |
    | 'button' => 'heading'          |
    | 'button' => 'space'            |
    |--------------------------------|
    */
This commit is contained in:
Julian Prieber 2022-06-09 09:59:04 +02:00
parent 032162cdbf
commit a3262e35ab
2 changed files with 153 additions and 1 deletions

View File

@ -20,6 +20,10 @@
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
@endif @endif
<!-- Custom icons font-awesome -->
<script src="https://kit.fontawesome.com/c4a5e06183.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="{{ asset('littlelink/css/animations.css') }}">
<link href="//fonts.googleapis.com/css?family=Open+Sans:400,600,800&display=swap" rel="stylesheet"> <link href="//fonts.googleapis.com/css?family=Open+Sans:400,600,800&display=swap" rel="stylesheet">
<link rel="stylesheet" href="{{ asset('littlelink/css/normalize.css') }}"> <link rel="stylesheet" href="{{ asset('littlelink/css/normalize.css') }}">
<link rel="stylesheet" href="{{ asset('littlelink/css/brands.css') }}"> <link rel="stylesheet" href="{{ asset('littlelink/css/brands.css') }}">
@ -94,10 +98,43 @@ foreach($pages as $page)
<?php echo $message->home_message; ?> <?php echo $message->home_message; ?>
</div> </div>
<?php $initial=1; // <-- Effectively sets the initial loading time of the buttons. This value should be left at 1. ?>
<!-- Buttons -->
<?php $initial=1; // <-- Effectively sets the initial loading time of the buttons. This value should be left at 1. ?>
@if(Config::get('meta.use_custom_buttons') == 'true')
<?php $array = Config::get('meta.buttons'); ?>
@foreach($array as $button)
@php $linkName = str_replace('default ','',$button['button']) @endphp
@if($button['button'] === "custom" and $button['custom_css'] === "" or $button['custom_css'] === "NULL")
<div style="--delay: {{ $initial++ }}s" class="button-entrance"><a class="button button-{{ $button['button'] }} button button-hover icon-hover" @if($button['link'] != '')rel="noopener noreferrer nofollow" href="{{ $button['link'] }}" target="_blank"@endif>@if($button['icon'] == 'llc')<img alt="button-icon" class="icon hvr-icon" src="{{ asset('\/littlelink/icons\/')}}llc.svg">@else<i style="color: {{ $button['icon'] }}" class="icon hvr-icon fa {{ $button['icon'] }}"></i>@endif{{ $button['title'] }}</a></div>
@elseif($button['button'] === "custom" and $button['custom_css'] != "")
<div style="--delay: {{ $initial++ }}s" class="button-entrance"><a class="button button-hover icon-hover" style="{{ $button['custom_css'] }}" @if($button['link'] != '')rel="noopener noreferrer nofollow" href="{{ $button['link'] }}" target="_blank"@endif>@if($button['icon'] == 'llc')<img alt="button-icon" class="icon hvr-icon" src="{{ asset('\/littlelink/icons\/')}}llc.svg">@else<i style="color: {{ $button['icon'] }}" class="icon hvr-icon fa {{ $button['icon'] }}"></i>@endif{{ $button['title'] }}</a></div>
@elseif($button['button'] === "buy me a coffee")
<div style="--delay: {{ $initial++ }}s" class="button-entrance"><a class="button button-coffee button button-hover icon-hover" @if($button['link'] != '')rel="noopener noreferrer nofollow" href="{{ $button['link'] }}" target="_blank"@endif><img alt="button-icon" class="icon hvr-icon" src="{{ asset('\/littlelink/icons\/')}}coffee.svg">Buy me a Coffee</a></div>
@elseif($button['button'] === "custom_website"and $button['custom_css'] === "" or $button['custom_css'] === "NULL")
<div style="--delay: {{ $initial++ }}s" class="button-entrance"><a class="button button-custom_website button button-hover icon-hover" @if($button['link'] != '')rel="noopener noreferrer nofollow" href="{{ $button['link'] }}" target="_blank"@endif><img alt="button-icon" class="icon hvr-icon" src="http://www.google.com/s2/favicons?domain={{$link->link}}">{{ $button['title'] }}</a></div>
@elseif($button['button'] === "custom_website" and $button['custom_css'] != "")
<div style="--delay: {{ $initial++ }}s" class="button-entrance"><a class="button button-hover icon-hover" style="{{ $button['custom_css'] }}" @if($button['link'] != '')rel="noopener noreferrer nofollow" href="{{ $button['link'] }}" target="_blank"@endif><img alt="button-icon" class="icon hvr-icon" src="http://www.google.com/s2/favicons?domain={{$link->link}}">{{ $button['title'] }}</a></div>
@elseif($button['button'] === "space")
<?php
if (is_numeric($button['title']) and $button['title'] < 10)
echo str_repeat("<br>",$button['title']);
elseif (is_numeric($button['title']) and $button['title'] >= 10)
echo str_repeat("<br>",10);
else
echo "<br><br><br>"
?>
@elseif($button['button'] === "heading")
<h2>{{ $button['title'] }}</h2>
@else
<div style="--delay: {{ $initial++ }}s" class="button-entrance"><a class="button button-{{ $button['button'] }} button button-hover icon-hover" @if($button['link'] != '')rel="noopener noreferrer nofollow" href="{{ $button['link'] }}" target="_blank"@endif><img alt="button-icon" class="icon hvr-icon" src="{{ asset('\/littlelink/icons\/') . $linkName }}.svg">{{ ucfirst($linkName) }}</a></div>
@endif
@endforeach
@else
<div style="--delay: {{ $initial++ }}s" class="button-entrance"><div class="button button-github button hvr-grow hvr-icon-wobble-vertical"><img alt="button-icon" class="icon hvr-icon" src="{{ asset('littlelink/icons/github.svg') }}">Github</div></div> <div style="--delay: {{ $initial++ }}s" class="button-entrance"><div class="button button-github button hvr-grow hvr-icon-wobble-vertical"><img alt="button-icon" class="icon hvr-icon" src="{{ asset('littlelink/icons/github.svg') }}">Github</div></div>
<div style="--delay: {{ $initial++ }}s" class="button-entrance"><div class="button button-twitter button hvr-grow hvr-icon-wobble-vertical"><img alt="button-icon" class="icon hvr-icon" src="{{ asset('littlelink/icons/twitter.svg') }}">Twitter</div></div> <div style="--delay: {{ $initial++ }}s" class="button-entrance"><div class="button button-twitter button hvr-grow hvr-icon-wobble-vertical"><img alt="button-icon" class="icon hvr-icon" src="{{ asset('littlelink/icons/twitter.svg') }}">Twitter</div></div>
<div style="--delay: {{ $initial++ }}s" class="button-entrance"><div class="button button-instagram button hvr-grow hvr-icon-wobble-vertical"><img alt="button-icon" class="icon hvr-icon" src="{{ asset('littlelink/icons/instagram.svg') }}">Instagram</div></div> <div style="--delay: {{ $initial++ }}s" class="button-entrance"><div class="button button-instagram button hvr-grow hvr-icon-wobble-vertical"><img alt="button-icon" class="icon hvr-icon" src="{{ asset('littlelink/icons/instagram.svg') }}">Instagram</div></div>
@endif
</br></br> </br></br>
<p>and {{ $countButton - 3 }} other buttons ...</p> <p>and {{ $countButton - 3 }} other buttons ...</p>

View File

@ -79,4 +79,119 @@ return [
// Do not change here! // Do not change here!
'analytics' => $analytics, // Set on top of page. 'analytics' => $analytics, // Set on top of page.
/*
|--------------------------------------------------------------------------
| Custom Buttons on Home Page
|--------------------------------------------------------------------------
|
| Here you can configure your own buttons for the Home Page.
| You can add or remove as many buttons as you like.
|
| The syntax of the custom buttons is as follows:
|
| array(
| 'button' => '',
| 'link' => '',
| 'title' => '',
| 'icon' => '',
| 'custom_css' => ''
| ),
|
| In the 'button' field, you have to enter the button name (i.e. 'twitter', 'github', 'custom'...).
| You can find a list of all available buttons below.
|
| In the 'link' field, can enter your desired link you can leave this field empty for a display only, non-functional button.
|
|
|
| The input fields below only apply to buttons such as 'custom' and 'custom_website' but must always be included even if only empty.
|~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
|
| In the 'title' field, changes the text on a button, such as 'custom' and 'custom_website'.
|
| In the 'icon' field, uses the same syntax as the Button Editor on the Admin Panel.
| This allows you to add your own icons to 'custom' buttons. You can find a list of available icons on llc.bio/fa.
|
| In the 'custom_css' field, here you can enter custom CSS to change the color of your button.
| If you don't feel comfortable working with CSS,
| you can copy and paste the CSS from the 'Custom CSS' field of the Button Editor on the Admin Panel.
|
*/
'use_custom_buttons' => 'true', // Set this to false if you wish to display the old buttons.
'buttons' => array(
array(
'button' => 'github',
'link' => 'https://github.com/JulianPrieber/littlelink-custom',
'title' => '',
'icon' => '',
'custom_css' => ''
),
array(
'button' => 'custom',
'link' => 'https://littlelink-custom.com',
'title' => 'Project Website',
'icon' => 'llc',
'custom_css' => 'color:#ffffff; background-image:linear-gradient(76deg, #f70fff 0%, #11d4de 100%);'),
array(
'button' => 'custom',
'link' => 'https://littlelink-custom.com/sponsor',
'title' => 'Help us out',
'icon' => 'fa-hand-holding-hand',
'custom_css' => 'color:#ffffff; background-image:radial-gradient(circle, #00d2ff 0%, #3a7bd5 95%);'
),
)
/*
|--------------------------------|
| List of Available buttons: |
|--------------------------------|
| 'button' => 'custom' |
| 'button' => 'custom_website' |
| 'button' => 'github' |
| 'button' => 'twitter' |
| 'button' => 'instagram' |
| 'button' => 'facebook' |
| 'button' => 'messenger' |
| 'button' => 'linkedin' |
| 'button' => 'youtube' |
| 'button' => 'discord' |
| 'button' => 'twitch' |
| 'button' => 'snapchat' |
| 'button' => 'spotify' |
| 'button' => 'reddit' |
| 'button' => 'medium' |
| 'button' => 'pinterest' |
| 'button' => 'soundcloud' |
| 'button' => 'figma' |
| 'button' => 'kit' |
| 'button' => 'telegram' |
| 'button' => 'tumblr' |
| 'button' => 'steam' |
| 'button' => 'vimeo' |
| 'button' => 'wordpress' |
| 'button' => 'goodreads' |
| 'button' => 'skoob' |
| 'button' => 'tiktok' |
| 'button' => 'default email' |
| 'button' => 'default email_alt'|
| 'button' => 'bandcamp' |
| 'button' => 'patreon' |
| 'button' => 'signal' |
| 'button' => 'venmo' |
| 'button' => 'cashapp' |
| 'button' => 'gitlab' |
| 'button' => 'mastodon' |
| 'button' => 'paypal' |
| 'button' => 'whatsapp' |
| 'button' => 'xing' |
| 'button' => 'buy me a coffee' |
| 'button' => 'website' |
| 'button' => 'heading' |
| 'button' => 'space' |
|--------------------------------|
*/
]; ];