I have strange issue in laravel blade everything works normally until I edit something in the file the master layout stop loading correctly for no reason
sometime the page html content load partially
It works fine on localhost but on the server
I stopped cloudflare and all caches
As I said the issue occurs only when I edit some file only that page stop working the other pages works normally unless I edit them or add something to them
I hope you can help me.
master file
<!doctype html>
<html class="no-js" lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<meta name="csrf-token" content="{{ csrf_token() }}"/>
<link rel="icon" type="image/png" href="{{asset('../storage/app/public/Favicon_reviews.png')}}">
<title>
{{(is_array(($web_title ?? ''))? $web_title[1] ?? '': $web_title ?? '') ?? 'Home'}}
</title>
{{--foundation css--}}
<link rel="stylesheet" href="{{asset('css/foundation.css')}}">
<!-- Custom styles for this template -->
<link rel="stylesheet" href="{{asset('css/dashboard.css')}}">
<link rel="stylesheet" href="{{asset('css/style.css')}}">
<link rel="stylesheet" href="{{asset('css/dripicon.css')}}">
<link rel="stylesheet" href="{{asset('css/typicons.css')}}">
<link rel="stylesheet" href="{{asset('css/font-awesome.min.css')}}">
<link rel="stylesheet" href="{{asset('css/theme.css')}}">
<link rel="stylesheet" href="{{asset('css/jquery.toastmessage.css')}}">
<link rel="stylesheet" href="{{asset('js/circle-progress/jquery.circliful.css')}}">
<!-- pace loader -->
{{--for top blue line loader--}}
<script src="{{asset('js/pace/pace.js')}}"></script>
<link rel="stylesheet" href="{{asset('js/pace/themes/green/pace-theme-flash.css')}}">
{{--<link rel="stylesheet" href="{{asset('js/pace/themes/templates/pace-theme-barber-shop.tmpl.css')}}">--}}
{{-- <link rel="stylesheet" href="{{asset('js/pace/themes/green/pace-theme-big-counter.css')}}">--}}
{{--end pace--}}
<link rel="stylesheet" href="{{asset('js/slicknav/slicknav.css')}}">
{{--to support effects in old broswer--}}
<script src="{{asset('js/vendor/modernizr.js')}}"></script>
<link rel="stylesheet" href="{{asset('css/main-style.css')}}">
{{--js scripts--}}
#yield('css')
</head>
<body>
<!-- preloader -->
<div id="preloader">
<div id="status"> </div>
</div>
<!-- End of preloader -->
<div class="off-canvas-wrap content" data-offcanvas>
<!-- right sidebar wrapper -->
<div class="inner-wrap">
<!-- Right sidemenu -->
<div id="skin-select">
<!-- Toggle sidemenu icon button -->
<a id="toggle">
<span class="fa icon-menu"></span>
</a>
<!-- End of Toggle sidemenu icon button -->
<div class="skin-part">
<div id="tree-wrap">
#include('main.left-nav')
</div>
</div>
</div>
<!-- end of Rightsidemenu -->
<div class="wrap-fluid" id="paper-bg">
<!-- top nav -->
<div class="top-bar-nest">
<nav class="top-bar" data-topbar role="navigation" data-options="is_hover: false">
#include('main.top-nav')
</nav>
</div>
<!-- end of top nav -->
<!-- breadcrumbs -->
<ul class="breadcrumbs ">
<li><a href="{{url('/')}}"><span style=" font-size: 15px; position: relative; top: -3px;"
class="fa fa-home"></span></a>
</li>
#if(is_array(($web_title ?? false)))
#foreach($web_title as $title)
<li>
{!! $title ?? '' !!}
</li>
#endforeach
#else
<li>
{{$web_title ?? ''}}
</li>
#endif
{{--<li>{{$web_title}}
</li>--}}
</ul>
<!-- end of breadcrumbs -->
<!-- Container Begin -->
<div class="row" style="margin-top:-20px">
#yield('container')
</div>
<!-- End of Container Begin -->
#include('main.footer')
</div>
<!-- Right Menu -->
<aside class="right-off-canvas-menu">
{{--#include('main.right-nav')--}}
</aside>
<!-- close the off-canvas menu -->
<a class="exit-off-canvas"></a>
<!-- End of Right Menu -->
</div>
<!-- end paper bg -->
</div>
<!-- end of off-canvas-wrap -->
<!-- end of inner-wrap -->
<!-- main javascript library -->
<script src="{{asset('/js/jquery.js')}}"></script>
<script src="{{asset('/js/waypoints.min.js')}}"></script>
<script src="{{asset('/js/preloader-script.js')}}"></script>
<!-- foundation javascript -->
<script src="{{asset('/js/foundation.min.js')}}"></script>
<script src="{{asset('/js/foundation/foundation.dropdown.js')}}"></script>
<!-- main edumix javascript -->
{{--add scroll bar to divs--}}
<script src="{{asset('/js/slimscroll/jquery.slimscroll.js')}}"></script>
{{--mobile menu--}}
<script src="{{asset('/js/slicknav/jquery.slicknav.js')}}"></script>
<script src="{{asset('/js/sliding-menu.js')}}"></script>
<script src="{{asset('/js/scriptbreaker-multiple-accordion-1.js')}}"></script>
<script src="{{asset('/js/number/jquery.counterup.min.js')}}"></script>
<script src="{{asset('/js/circle-progress/jquery.circliful.min.js')}}"></script>
<script src="{{asset('/js/jquery.toastmessage.js')}}"></script>
<script src="{{asset('/js/app.js')}}"></script>
<script type="text/javascript">
$.ajaxSetup({
headers: {
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
</script>
<script type="text/javascript">
(function ($) {
"use strict";
})(jQuery);
</script>
<script>
$(document).foundation();
</script>
<script>
/*helper functions*/
function confirm(title, message, callback) {
// create your modal template
var modal = '<div class="reveal-modal tiny" id="confirmation" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog" data-animation-in="slide-in-down">' +
'<h2>' + title + '</h2>' +
'<p class="lead">' + message + '</p>' +
'<button class="button success yes" style="margin-right: 50px;">Yes</button>' +
'<button class="button alert float-right close-reveal" >No</button>' +
'</div>';
// appending new reveal modal to the page
$('body').append(modal);
// registergin this modal DOM as Foundation reveal
/* var confirmation = new Foundation.Reveal($('#confirmation'));
// open
confirmation.open();*/
var confirm_selector = $('#confirmation');
confirm_selector.foundation('reveal', 'open');
// listening for yes click
confirm_selector.children('.yes').on('click', function () {
// close and REMOVE FROM DOM to avoid multiple binding
confirm_selector.foundation('reveal', 'close');
confirm_selector.remove();
// calling the function to process
callback.call();
});
$(document).on('closed.zf.reveal', '#confirmation', function () {
// remove from dom when closed
confirm_selector.foundation('reveal', 'close');
});
}
$(document).on('click', '.close-reveal', function () {
$('#confirmation').foundation('reveal', 'close');
});
</script>
{{--header javascript--}}
{{--search process img--}}
<script>
$(document).ready(function () {
$('#search_form').submit(function (e) {
$('#search_loading').show();
});
});
</script>
<script>
$(document).ready(function () {
$('#contact_us_form').submit(function (event) {
event.preventDefault();
$('.message_button').prop('disabled', true);
$.ajax({
url: '{{url('/contact_us')}}',
type: 'POST',
data: $(this).serialize(),
success: function (data) {
// console.log(data);
$().toastmessage('showToast', {
text: data.success,
stayTime: 3000,
sticky: false,
position: 'top-center',
type: 'success',
closeText: '',
close: null
});
$('.message_button').prop('disabled', false);
$('#requests').foundation('reveal', 'close');
$("#contact_us_form")[0].reset();
}
});
})
});
</script>
{{--request form--}}
<script>
$(document).ready(function () {
$('#requests_form').submit(function (event) {
event.preventDefault();
$('.message_button').prop('disabled', true);
$.ajax({
url: '{{url('/contact_us')}}',
type: 'POST',
data: $(this).serialize(),
success: function (data) {
$().toastmessage('showToast', {
text: data.success,
stayTime: 3000,
sticky: false,
position: 'top-center',
type: 'success',
closeText: '',
close: null
});
$('.message_button').prop('disabled', false);
$('#requests').foundation('reveal', 'close');
$("#requests_form")[0].reset();
}
});
})
});
</script>
<script>
$('.input_option').change(function () {
if ($(this).val() == 'tag') {
$('.tag_messages').html('You can add more then one tag by adding comma Ex(tag1,tag2,.....)');
} else {
$('.tag_messages').html('');
}
});
</script>
<script>
var textarea = null;
window.addEventListener("load", function () {
textarea = window.document.querySelector("#contact_area");
textarea.addEventListener("keypress", function () {
if (textarea.scrollTop != 0) {
textarea.style.height = textarea.scrollHeight + "px";
}
}, false);
}, false);
</script>
<script>
var textarea = null;
window.addEventListener("load", function () {
textarea = window.document.querySelector("#contact_area1");
textarea.addEventListener("keypress", function () {
if (textarea.scrollTop != 0) {
textarea.style.height = textarea.scrollHeight + "px";
}
}, false);
}, false);
</script>
#yield('javascript')
</body>
</html>
Home page
#extends('main.master')
#section('container')
<div class="row" style="margin-top:-20px">
<div class="large-12 columns">
<blockquote style="border-right: 3px solid #8c92a3;text-align: center;margin-top: 5px;">
Thank you for installing the application, please take a moment of your time and rate the app. It will help us to improve the application for you.
<a>Rate Here</a>
</blockquote>
</div>
</div>
<div class="row" >
<div class="large-8 columns">
<div class="box bg-transparent ">
<!-- /.box-header -->
<div class="box-header no-pad bg-transparent">
<h3 style="margin-bottom:20px;" class="box-title">
<span>Daily Visitors</span>
</h3>
</div>
<div class="box-body no-pad">
<div id="line-chart" style="height: 235px; padding: 0px; position: relative;">
<canvas class="flot-base"
style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 785px; height: 235px;"
width="863" height="258"></canvas>
<div class="flot-text"
style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; font-size: smaller; color: rgb(84, 84, 84);">
<div class="flot-x-axis flot-x1-axis xAxis x1Axis"
style="position: absolute; top: 0px; left: 0px; bottom: 0px; right: 0px; display: block;">
</div>
</div>
<canvas class="flot-overlay"
style="direction: ltr; position: absolute; left: 0px; top: 0px; width: 785px; height: 235px;"
width="863" height="258"></canvas>
</div>
</div>
<!-- /.box-body -->
</div>
<!-- /.box -->
</div>
<div class="large-4 columns">
<div class="box bg-transparent ">
<!-- /.box-header -->
<div class="box-header no-pad bg-transparent">
<h3 style="margin:0 20px 0 -5px;" class="box-title">
<span>Visitors</span>
</h3>
</div>
<div style="margin:15px 0 0" class="box-body no-pad">
<div class="stats-wrap">
<h2><b class="counter-up" style="color:#666;">{{$counter_visitors_data[0]['year'] ?? 0 }}</b> <span
style="background:#666;">+<b
class="counter-up">{{($counter_visitors_data[0]['year_rating'] ?? 0) <= 100 ? ($counter_visitors_data[0]['year_rating']?? 0): 100 }}</b>%</span>
</h2>
<p class="text-grey">Total Visitors
<small>This Year vs last year</small>
</p>
<h4><b class="counter-up" style="color:#888;">{{$counter_visitors_data[1]['month'] ?? 0 }}</b> <span
style="background:#888;">+<b
class="counter-up">{{($counter_visitors_data[1]['month_rating'] ?? 0) <= 100 ? ($counter_visitors_data[0]['month_rating'] ?? 0):100}}</b>%</span>
</h4>
<p>New Visitors
<small>This Month</small>
</p>
<h4 style="color:#333;"><b class="counter-up">{{$counter_visitors_data[2]['week'] ?? 0 }}</b> <span
style="background:#333;">+<b
class="counter-up">{{($counter_visitors_data[2]['week_rating'] ?? 0) <= 100 ? ($counter_visitors_data[0]['week_rating']?? 0):100}}</b></span></h4>
<p>New Visitors
<small>This week</small>
</p>
</div>
</div>
<!-- /.box-body -->
</div>
<!-- /.box -->
</div>
</div>
{{------------------------------------------section 2---------------------------------------}}
<div class="row" style="margin-top: 20px;">
<div class="large-4 columns">
<div class="box bg-transparent ">
<!-- /.box-header -->
<div class="box-header no-pad bg-transparent">
<h3 style="margin:0 20px 0 -5px;" class="box-title">
<span>Reviews</span>
</h3>
</div>
<div style="margin:15px 0 0" class="box-body no-pad">
<div class="stats-wrap">
<h2><b class="counter-up" style="color:#666;">{{$counter_reviews_data[0]['year'] ?? 0 }}</b> <span
style="background:#666;">+<b
class="counter-up">{{($counter_reviews_data[0]['year_rating'] ?? 0) <= 100 ? ($counter_reviews_data[0]['year_rating']?? 0):100}}</b>%</span>
</h2>
<p class="text-grey">Total Reviews
<small>This Year vs last year</small>
</p>
<h4><b class="counter-up" style="color:#888;">{{$counter_reviews_data[1]['month']?? 0 }}</b> <span
style="background:#888;">+<b
class="counter-up">{{($counter_reviews_data[1]['month_rating'] ?? 0) <= 100 ? ($counter_reviews_data[1]['month_rating']?? 0):100}}</b>%</span>
</h4>
<p>New Reviews
<small>This Month</small>
</p>
<h4 style="color:#333;"><b class="counter-up">{{$counter_reviews_data[2]['week']?? 0 }}</b> <span
style="background:#333;">+<b
class="counter-up">{{($counter_reviews_data[2]['week_rating'] ?? 0) <= 100 ? ($counter_reviews_data[2]['week_rating']?? 0):100 }}</b>%</span></h4>
<p>New Reviews
<small>This week</small>
</p>
</div>
</div>
<!-- /.box-body -->
</div>
<!-- /.box -->
</div>
<div class="large-4 columns">
<div class="bg-complete-profile">
<span class="bg-green fa fa-star"></span>
<!-- <img src="img/bag.png"> -->
<h6 class="bg-black text-white"><strong><a href="https://apps.shopify.com/aliexpress-reviews-2"
style="color: #ffffff;">Rate Application</a></strong></h6>
</div>
</div>
<div class="large-4 columns">
<div class="bg-complete-profile">
<span class="bg-green fontello-doc-1"></span>
<!-- <img src="img/box.png"> -->
<h6 class="bg-black text-white">FAQ</h6>
</div>
</div>
<div class="large-4 columns">
<div class="bg-complete-profile">
<span class="bg-green icon-user-group"></span>
<!-- <i class="img/count.png"></i> -->
<h6 class="bg-black text-white"><a href="{{url('visitors')}}" style="color: #ffffff;">Latest
Visitors</a></h6>
</div>
</div>
<div class="large-4 columns">
<div class="bg-complete-profile">
<span class="bg-green fontello-params"></span>
<!-- <i class="img/count.png"></i> -->
<h6 class="bg-black text-white"><a href="{{url('General_options')}}" style="color: #ffffff;">Main
Setting</a></h6>
</div>
</div>
</div>
{{------------------------------------------section 3---------------------------------------}}
<div class="large-12 columns">
<div class="box">
<div class="box-header bg-transparent">
<!-- tools box -->
<div class="pull-right box-tools">
<span class="box-btn" data-widget="collapse"><i class="icon-minus"></i>
</span>
<span class="box-btn" data-widget="remove"><i class="icon-cross"></i>
</span>
</div>
<h3 class="box-title"><i class=" icon-calendar"></i>
<span>Latest Visitor</span>
</h3>
</div>
<!-- /.box-header -->
<div class="box-body" style="display: block;">
<style>
#media screen and (max-width: 1400px) {
.visitors_images {
left: 60% !important;
}
}
#media screen and (max-width: 1000px) {
.visitors_images {
left: 50% !important;
top: 43px !important;
}
}
#media screen and (max-width: 700px) {
.visitors_images {
left: 65% !important;
top: 43px !important;
}
}
</style>
<div class="row">
<?php $counter = 0; ?>
#foreach($visitors as $visitor)
<?php
$product_id = $visitor['product_id'];
$country_code = $visitor['country_code'];
?>
<div class="large-4 medium-6 small-12 columns" style="float: left !important;">
<div class="school-timetable">
<hr>
<h5><span style="background: #92CD18;">New</span><strong> Visitor </strong>For
Product:<i><a
href="{{url("comments/$product_id/$shop")}}"
target="_blank">
{{str_limit(($visitor['product']['products'][0]['title'] ?? 'No Title'),17) }}
</a></i></h5>
<h6><i class=" fontello-home-outline"></i> From <span
style="background: transparent;"><img style="margin-bottom: 5px;"
src="{{url("images/flags").'/'.strtolower($country_code).'.png' ?? ''}}"></span>
</h6>
<h6 style="margin-bottom: 20px;"><i
class=" fontello-clock"></i>{{date('D, F y',strtotime($visitor['created_at'] ?? ''))}}
y
<span
class="bg-black">{{date('g a',strtotime($visitor['created_at'] ?? ''))}}</span>
</h6>
<div class="visitors_images" style=" position: absolute;
left: 56%;
top: 43px;">
<img width="50px"
src="{{$visitor['product']['products'][0]['images'][0]['src'] ?? URL::asset('../storage/app/public/NoPicAvailable.png')}}">
</div>
</div>
</div>
<?php $counter ++; ?>
#endforeach
</div>
</div>
<!-- /.box-body -->
</div>
</div>
#endsection
#section('javascript')
<script src="{{URL::to('/js/flot/jquery.flot.js')}}"></script>
<!-- FLOT RESIZE PLUGIN - allows the chart to redraw when the window is resized -->
<script src="{{URL::to('/js/flot/jquery.flot.resize.min.js')}}"></script>
<!-- FLOT PIE PLUGIN - also used to draw donut charts -->
<script src="{{URL::to('/js/flot/jquery.flot.pie.min.js')}}"></script>
<!-- FLOT CATEGORIES PLUGIN - Used to draw bar charts -->
<script src="{{URL::to('/js/flot/jquery.flot.categories.min.js')}}"></script>
<script type="text/javascript">
<?php $counter_days = 1;?>
var ticks = [
#foreach($numbers_of_visitors_last_10_days as $keys=>$dates )
#if($counter_days <=1)
[{{ltrim($keys,'0')}}, "days {{ltrim($keys,'0')}}"],
#else
[{{ltrim($keys,'0')}},{{ltrim($keys,'0')}}],
#endif
<?php $counter_days ++;?>
#endforeach
];
$(function () {
"use strict";
/*
* LINE CHART
* ----------
*/
var line_data2 = [
#foreach($numbers_of_visitors_last_10_days as $keys=>$dates )
[{{ltrim($keys,'0')}}, {{count($dates)}}],
#endforeach
];
var xaxisLabel = $("<div class='axisLabel xaxisLabel'></div>")
.text("My X Label")
.appendTo($('#line-chart'));
$.plot("#line-chart", [line_data2], {
grid: {
hoverable: true,
borderColor: "#E2E6EE",
borderWidth: 1,
tickColor: "#E2E6EE"
},
series: {
shadowSize: 2,
lines: {
show: true
},
points: {
show: true
}
},
colors: ["#333333", "#cccccc"],
lines: {
fill: true,
},
yaxis: {
show: true,
tickFormatter: function (val, axis) { return val }
},
xaxis: {
show: true,
ticks: ticks,
}
});
});
</script>
#endsection
I think it because of cached views. laravel make all the pages and save them in storage/framework/views directory.So that it won't have to make the pages from scratch in every request. And make the loading faster.
type this on cmd after editing the files:
php artisan view:clear
Or you can delete them manually.
after that type this on cmd:
composer dump-autoload
Then laravel has to make the pages and save them again.
Hope it would help!
Related
Can someone please help? As it says in the title, im trying "create" an alphabet in PHP, which my gf and I can only understand (it's a little thing that i thought to have with her), but im facing some problems.
I have this code here in HTML and PHP which its purpose is to replace an alphabet letter to some other character.
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>XXX</title>
<link href="assets/img/favicon.png" rel="icon">
<link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<link href="assets/css/style.css" rel="stylesheet">
<script src="assets/js/jquery.min.js"></script>
<style type="text/css">
#font-face { font-family: "Raleway"; src:url("assets/font/Raleway-Regular.ttf"); }
ul li {
list-style-type: none;
}
.row {
--bs-gutter-x: 1.5rem;
}
</style>
</head>
<body style="font-family: Raleway">
<main id="main" class="my-0">
<section class="contact">
<div class="container d-flex justify-content-center">
<div class="col-12 col-md-12 col-lg-5">
<div style="float: none; margin: auto">
<form method="post" role="form" class="php-email-form">
<div class="row form-group mt-md-0">
<textarea placeholder="AaBbCcDd" class="form-control" name="frase" style="height: 400px;resize: none;"></textarea><br>
</div>
<div class="row my-3">
<div class="col-4 col-sm-6 col-md-8 col-lg-6 form-group mt-md-0">
<button style="padding: 10px" type="submit" class="form-control" name="submit">Traduzir</button>
</div>
<div class="col-4 col-sm-3 col-md-2 col-lg-3 form-group mt-md-0">
<button formaction="descodificador.php" type="submit" class="form-control"><img src="assets/img/reverse.svg" width="15px"></button>
</div>
<div class="col-4 col-sm-3 col-md-2 col-lg-3 form-group mt-md-0" onclick="copiar(); return false;">
<button class="form-control botoes" type="submit"><img src="assets/img/copy.png" width="15px"></button>
</div>
</div>
<?php
if (isset($_POST['submit'])) {
$frase=$_POST["frase"];
if (!empty($frase)) {
Function translate($string) {
$alfabeto = array(
"a"=>"_","A"=>"_",
"b"=>"8","B"=>"8",
"c"=>"!","C"=>"!",
"d"=>"5","D"=>"5",
"e"=>"=","E"=>"=",
"f"=>"(","F"=>"(",
"g"=>"$","G"=>"$",
"h"=>"9","H"=>"9",
"i"=>'"',"I"=>'"',
"j"=>"1","J"=>"1",
"k"=>"+","K"=>"+",
"l"=>"#","L"=>"#",
"m"=>"2","M"=>"2",
"n"=>":","N"=>":",
"o"=>"7","O"=>"7",
"p"=>"<","P"=>"<",
"q"=>")","Q"=>")",
"r"=>"4","R"=>"4",
"s"=>"/","S"=>"/",
"t"=>"*","T"=>"*",
"u"=>"0","U"=>"0",
"v"=>">","V"=>">",
"w"=>";","W"=>";",
"x"=>"3","X"=>"3",
"y"=>"&","Y"=>"&",
"z"=>"6","Z"=>"6",
" "=>" ",
"?"=>"?",
"."=>".",
","=>",",
"-"=>"-","ç"=>"{");
$saida = array();
$entrada = str_split($string);
Foreach ($entrada as $key => $value) {
$saida[] = $alfabeto[$value];
}
Return implode('', $saida);
}
echo "<div id='frase' style='overflow:hidden;word-wrap:break-word'>".translate($frase)."</div>";
} else {
echo "<font style=color:#c46968>Caracter não suportado</font>";
}
} else {
echo "<font style=color:#68a4c4>Insere o texto</font>";
}
?>
</form>
</div>
</div>
</div>
</section>
</main>
<script type="text/javascript">
var listForRemove = [];
var listOfUniqe = [];
$('#frase').each(function () {
var text = $(this).text().trim();
if (listOfUniqe.indexOf(text) === -1)
listOfUniqe.push(text);
else
listForRemove.push($(this));
});
$(listForRemove).each(function () { $(this).remove(); });
</script>
<script type="text/javascript">
function copiar() {
if (window.getSelection) {
var range = document.createRange();
range.selectNode(document.getElementById("frase"));
window.getSelection().addRange(range);
document.execCommand("copy");
}
}
</script>
<script src="assets/vendor/aos/aos.js"></script>
<script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/vendor/glightbox/js/glightbox.min.js"></script>
<script src="assets/vendor/swiper/swiper-bundle.min.js"></script>
<script src="assets/js/main.js"></script>
</body>
But when I try to use the letter "ç" it appears this, and i can't really understand why and how to solve it
OUTPUT
Warning: Undefined array key "�" in C:\xampp\htdocs\XX\index.php on line 92
Warning: Undefined array key "�" in C:\xampp\htdocs\XX\index.php on line 92
Please help me, this is really important to me and my gf.
I am making the mobile version of a php website that has a sortable list.
Inside the li tag there are three divs, the first and the second are clickable and should open a modal window.
<ul id='sortable'>
//...multiple li tags
<li class='ui-state-default row'>
<div class='col-sm-1 col-xs-2' data-toggle='modal' data-target='#confirm-edit' onclick='modificaModale()'>
<i class='fas fa-edit iconeScheda'></i>
</div>
<div class='col-sm-1 col-xs-2' data-toggle='modal' data-target='#confirm-elimina-esercizio' onclick='eliminaModale()'>
<i class='fas fa-trash-alt iconeScheda'></i>
</div>
<div class='col-sm-10 col-xs-10'>
<b>Name of exercise</b>
</div>
</li>
//...
</ul>
On a desktop browser everything works fine but on mobile devices the two divs are not clickable and the modal won't open.
If I remove the sortable the modal opens on mobile too.
My head tag looks like this:
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script src="jquery.ui.touch-punch.min.js"></script>
<link href="style.css" rel="stylesheet" type="text/css">
<script>
function modificaModale(id) {
//do stuff
}
function eliminaModale() {
//do stuff
}
$(function () {
$("#sortable").sortable({
axis: 'y',
type: 'li',
update: function (event, ui) {
var data = $(this).sortable('serialize');
$.ajax({
data: data,
type: 'POST',
url: 'some url'
});
}
});
});
</script>
</head>
and the style of those
#sortable { list-style-type: none; margin: 0; padding: 0; cursor: grab;}
#sortable li span { position: absolute; margin-left: -1.3em; }
.iconeScheda{
cursor:pointer;
font-size: 20px;
padding: 5px;
font-weight: 100;
}
one of my modal is like this (the other is pretty much the same)
<div class="modal fade" id="confirm-elimina-esercizio" tabindex="-1" role="dialog"
aria-labelledby="myModalLabel" aria-hidden="true" style="background: none">
<div class="modal-dialog">
<div class="modal-content">
<form action="eliminaScheda.php" method="post">
<input type="text" name="id" id="idElimina" style="display:none"/>
<div class="modal-header">
<h3>Elimina</h3>
</div>
<div class="modal-body">
Sei sicuro di voler eliminare <span id="esercizioModale"></span>?
</div>
<div class="modal-footer">
<input type="submit" value="Conferma"/>
<input type="button" data-dismiss="modal" value="Annulla"/>
</div>
</form>
</div>
</div>
</div>
Without the "sortable" id, the modals open normally.
Here pictures of the web:
desktop version here
and the mobile version:
mobile version here
Thanks in advance
As I checked code in codepen
codepen.io/nickjackson139/pen/PoorWOG in mobile view it is opening model.
function modificaModale(id) {
//do stuff
}
function eliminaModale() {
//do stuff
}
$(function() {
$("#sortable").sortable({
axis: 'y',
type: 'li',
update: function(event, ui) {
var data = $(this).sortable('serialize');
$.ajax({
data: data,
type: 'POST',
url: 'some url'
});
}
});
});
#sortable {
list-style-type: none;
margin: 0;
padding: 0;
cursor: grab;
}
#sortable li span {
position: absolute;
margin-left: -1.3em;
}
.iconeScheda {
cursor: pointer;
font-size: 20px;
padding: 5px;
font-weight: 100;
}
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.1/css/all.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
</head>
<ul id='sortable'>
<li class='ui-state-default row'>
<div class='col-sm-1 col-xs-2' data-toggle='modal' data-target='#confirm-edit' onclick='modificaModale()'>
<i class='fas fa-edit iconeScheda'></i>
</div>
<div class='col-sm-1 col-xs-2' data-toggle='modal' data-target='#confirm-elimina-esercizio' onclick='eliminaModale()'>
<i class='fas fa-trash-alt iconeScheda'></i>
</div>
<div class='col-sm-10 col-xs-10'>
<b>Name of exercise</b>
</div>
</li>
</ul>
<div class="modal fade" id="confirm-elimina-esercizio" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="background: none">
<div class="modal-dialog">
<div class="modal-content">
<form action="eliminaScheda.php" method="post">
<input type="text" name="id" id="idElimina" style="display:none" />
<div class="modal-header">
<h3>Elimina</h3>
</div>
<div class="modal-body">
Sei sicuro di voler eliminare <span id="esercizioModale"></span>?
</div>
<div class="modal-footer">
<input type="submit" value="Conferma" />
<input type="button" data-dismiss="modal" value="Annulla" />
</div>
</form>
</div>
</div>
</div>
This is my html code. It dynamically creates these textboxes but they all have the same name.
<?php
include 'db.php';
$office = $_GET['office'];
$application_name = $_GET['application_name'];
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="description" content="">
<meta name="author" content="">
<title>Add Requirements for New Application</title>
<!-- Bootstrap core CSS -->
<link href="vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
<!-- Custom styles for this template -->
<link href="css/sidebar.css" rel="stylesheet">
<script type="text/javascript" src="//code.jquery.com/jquery-latest.js"></script>
<script src="js/jquery.min.js"></script>
<link href="css/bootstrap.min.css" rel="stylesheet">
<script src="js/bootstrap.min.js"></script>
<!-- Bootstrap css library -->
</head>
<style>
.header--banner {
background-image: url(cb.jpg);
background-size:100% 100%;
background-repeat: no-repeat;
}
.header--banner {
height: 45.5rem;
}
.jumbotron{
padding: 0.5em 0.6em;
}
.header--banner {
background-image: url(magic.jpg);
background-size:100% 100%;
background-repeat: no-repeat;
}
.header--banner {
height: 45.5rem;
}
.jumbotron{
padding: 0.5em 0.6em;
position: relative;
text-align: center;
color: black;
}
.green{
text-decoration: none;
font-family: Modern;
font-size: 18px;
border-radius: 5px;
padding: 5px 8px;
background-color: #27ae60;
color: #ffffff;
}
a.green:hover{
text-decoration: none;
background-color: #145a32;
color: #ffffff;
transition: 0.7s;
}
.bs-example2{
border: 3px solid black;
background: #f5f5f5;
text-align: center;
padding:20px;
margin:5px;
height:200px;
}
</style>
<body>
<header class="header--banner">
<div id="wrapper">
<!-- Sidebar -->
<div id="sidebar-wrapper">
<ul class="sidebar-nav">
<li class="sidebar-brand">
<a href="kiosk-HOMEPAGE.php">
HOME
</a>
</li>
<li>
Offices
</li>
<li>
Employees
</li>
<li>
Change Username & Password
</li>
<li>
Reports
</li>
<li>
Log Out
</li>
</ul>
</div>
<!-- /#sidebar-wrapper -->
<!-- Page Content -->
<div id="page-content-wrapper">
<div class="jumbotron">
<div class="container-fluid">
<img src="urdBanner.jpg" id="urdBanner" alt="Banner" style="width:100%; height:250px;">
<center><h2 style="position:relative;">Requirements</h2></center>
<p></p>
<img src="menu.jpg" class="rounded-circle" style="width:30px; height:30px;">
<br>
<br>
Previous
<br>
<br>
<form method="get" action="kiosk-NEW_CHARTER_REQUIREMENTS_insert.php">
<input type="hidden" name="office" value="<?php echo $office ?>">
<input type="hidden" name="application_name" value="<?php echo $application_name ?>">
<br>
<div class="row form-group">
<div class="col-md-2"><label for="textBox" class="col-form-label"><b>Step By Step Procedure</b></label>
</div>
<div class="col-md-2"><label for="textBox" class="col-form-label"><b>Personnel in charge</b></label>
</div>
<div class="col-md-2"><label for="textBox" class="col-form-label"><b>Time needed to complete procedure</b></label>
</div>
<div class="col-md-2"><label for="textBox" class="col-form-label"><b>Amount of fees if any</b></label>
</div>
<div class="col-md-2"><label for="textBox" class="col-form-label"><b>Required Documents</b></label>
</div>
<div class="col-md-2"><label for="textBox" class="col-form-label"><b>Procedure for the filing of complaints</b></label>
</div>
</div>
</div>
<div class="form-group fieldGroup">
<div class="input-group">
<div class="col-md-2">
<textarea name="steps[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Steps"></textarea>
</div>
<div class="col-md-2">
<textarea name="personnel[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Personnel"></textarea>
</div>
<div class="col-md-2">
<textarea name="time[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Time"></textarea>
</div>
<div class="col-md-2">
<textarea name="fees[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Fees"></textarea>
</div>
<div class="col-md-2">
<textarea name="documents[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Documents"></textarea>
</div>
<div class="col-md-2">
<textarea name="complaints[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Complaints"></textarea>
</div>
<div class="input-group-addon">
<span class="glyphicon glyphicon glyphicon-plus" aria-hidden="true"></span> Add
</div>
</div>
</div>
<!-- copy of input fields group -->
<div class="form-group fieldGroupCopy" style="display: none;">
<div class="input-group">
<div class="col-md-2">
<textarea name="steps[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Steps"></textarea>
</div>
<div class="col-md-2">
<textarea name="personnel[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Personnel"></textarea>
</div>
<div class="col-md-2">
<textarea name="time[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Time"></textarea>
</div>
<div class="col-md-2">
<textarea name="fees[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Fees"></textarea>
</div>
<div class="col-md-2">
<textarea name="documents[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Documents"></textarea>
</div>
<div class="col-md-2">
<textarea name="complaints[]" class="form-control" onkeyup="AutoGrowTextArea(this)" placeholder="Complaints"></textarea>
</div>
<div class="input-group-addon">
<span class="glyphicon glyphicon glyphicon-remove" aria-hidden="true"></span> Remove
</div>
</div>
</div>
<input type="submit" name="submit" class="btn btn-primary" value="SUBMIT"/>
</form>
</div>
</div>
</div>
</div>
</header>
<script type="text/javascript">
$(document).ready(function(){
//group add limit
var maxGroup = 10;
//add more fields group
$(".addMore").click(function(){
if($('body').find('.fieldGroup').length < maxGroup){
var fieldHTML = '<div class="form-group fieldGroup">'+$(".fieldGroupCopy").html()+'</div>';
$('body').find('.fieldGroup:last').after(fieldHTML);
}else{
alert('Maximum '+maxGroup+' groups are allowed.');
}
});
//remove fields group
$("body").on("click",".remove",function(){
$(this).parents(".fieldGroup").remove();
});
});
</script>
<script type="text/javascript">
// Auto-Grow-TextArea script.
// Script copyright (C) 2011 www.cryer.co.uk.
// Script is free to use provided this copyright header is included.
function AutoGrowTextArea(textField)
{
if (textField.clientHeight < textField.scrollHeight)
{
textField.style.height = textField.scrollHeight + "px";
if (textField.clientHeight < textField.scrollHeight)
{
textField.style.height =
(textField.scrollHeight * 2 - textField.clientHeight) + "px";
}
}
}
</script>
<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- Menu Toggle Script -->
<script>
$("#menu-toggle").click(function(e) {
e.preventDefault();
$("#wrapper").toggleClass("toggled");
});
</script>
</body>
</html>
this is my insert.php
<?php
if(isset($_GET['submit'])){
$con = mysqli_connect('localhost','root','','information_kiosk');
$office = $_GET['office'];
$application_name = $_GET['application_name'];
$steps = $_GET['steps'];
$personnel = $_GET['personnel'];
$time = $_GET['time'];
$fees = $_GET['fees'];
$documents = $_GET['documents'];
$complaints = $_GET['complaints'];
$totalSize = sizeof($steps);
for($i=0;$i <=$totalSize;$i++) {
$InsertSteps = (!empty($steps[$i])) ? $steps[$i] : '';
$InsertPersonnel = (!empty($personnel[$i])) ? $personnel[$i] : '';
$InsertTime = (!empty($time[$i])) ? $time[$i] : '';
$InsertFees = (!empty($fees[$i])) ? $fees[$i] : '';
$InsertDocuments = (!empty($documents[$i])) ? $documents[$i] : '';
$InsertComplaints = (!empty($complaints[$i])) ? $complaints[$i] : '';;
echo $InsertSteps;
echo "<br>";
echo $InsertPersonnel;
echo $InsertSteps;
echo "<br>";
}
}
?>
*update. with my insert code now it only shows the first row of data but not the 2nd or 3rd
only the first row gets inserted into database but the following dynamically created rows dont. My question is how could i change my syntax so that each row would insert into the database for example.
stepsColumn PersonnelColumn timeColumn feesColumn documentsColumn
array[0] array[0] array [0] array[0] array[0]
array[1] array[1] array [1] array[1] array[1]
I want to delete user with bootbox dialog window but when i click remove button the bootbox dialog window doesn't show. I wrote a simple program. Here is my codes:
Before i confirm in libraries:
<head>
<title>Adminstration</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script type="text/javascript" src="bootbox.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
My html code like this:
<form id="form1" action="footer.php">
<div class="body-wrap" id="wrapper" style="overflow: auto;">
<div class="container" id="container" style=" margin-top: 40px;">
<div class="well col-xs-8 col-sm-8 col-md-8 col-lg-8 col-xs-offset-2 col-sm-offset-2 col-md-offset-2 col-lg-offset-2" id="well">
<?php $arr = array(1, 2, 3, 4); foreach ($arr as $value)
{ $value = $value * 2;
?>
<div class="row user-row" style="border-bottom: 1px solid #ddd;">
<div class="col-xs-8 col-sm-9 col-md-10 col-lg-10">
<strong><?php echo $value ?></strong><br>
<span class="text-muted">Value: <?php echo $value; ?> </span>
</div>
<div class="col-xs-1 col-sm-1 col-md-1 col-lg-1 dropdown-user pull-right" data-for=".<?php echo $value; ?>">
<i class="glyphicon glyphicon-chevron-down text-muted "></i>
</div>
</div>
<div class="row user-infos <?php echo $value; ?>" id="user-infos">
<div class="col-xs-12 col-sm-12 col-md-10 col-lg-10 col-xs-offset-0 col-sm-offset-0 col-md-offset-1 col-lg-offset-1" id="col-xs">
<div class="panel panel-primary" id="panel">
<div class="panel-heading">
<h2 class="panel-title" style="text-align: center;">user info</h2>
</div>
<div class="panel-body">
<div class="row-fluid">
<div class="span6">
<h3> <?php echo $value ?> </h3><br>
</div>
</div>
</div>
<div class="panel-footer clearfix" id="footer">
<span>
<a class="delete_user btn btn-danger btn-sm pull-right" id="del" href="" data-toggle="tooltip" title="Delete user"><span class="glyphicon glyphicon-remove"></span></a>
</span >
</div>
</div>
</div>
</div><?php } ?>
</div>
</div>
</div>
</form>
And js code:
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
});
/************************USERS********************************/
$(document).ready(function() {
var panels = $('.user-infos');
var panelsButton = $('.dropdown-user');
panels.hide();
//Click dropdown
panelsButton.click(function() {
//get data-for attribute
var dataFor = $(this).attr('data-for');
var idFor = $(dataFor);
//current button
var currentButton = $(this);
idFor.slideToggle(400, function() {
//Completed slidetoggle
if(idFor.is(':visible'))
{
currentButton.html('<i class="glyphicon glyphicon-chevron-up text-muted"></i>');
}
else
{
currentButton.html('<i class="glyphicon glyphicon-chevron-down text-muted"></i>');
}
})
});
});
/********************************************************/
/************************DELETE USERS*************************************/
$(document).ready(function(){
$('.delete_user#del').click(function(e){
e.preventDefault();
bootbox.dialog({
message: "<i class='fa fa-warning fa-2x' style='color: orange;'></i><span style='font-size:16px; position: absolute; margin-left: 5px; margin-top: 5px;'>Are you sure to delete this user?</span>",
title: "<i class='glyphicon glyphicon-trash'></i> Delete user!",
buttons: {
danger: {
label: "Delete!",
className: "btn-danger",
callback: function() {/*some code*/}
},
success: {
label: "No",
className: "btn-success",
callback: function() {
$('.bootbox').modal('hide');
}
}
}
});
});
});
/*******************************************************************/
This js code for bootbox dialog is work another php file but doesn't work for this php file.
I have index.php main page:
<!doctype html>
<html>
<head>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-123456789123456",
enable_page_level_ads: true
});
</script>
<?php require_once "system/configs.php"; ?>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="<?= $baseurl?>css/bootstrap.css">
<link rel="stylesheet" href="<?= $baseurl?>css/font-awesome.css">
<meta name="google-signin-client_id" content="80957862538-juiu2cgia32rn3lik36fv9a1ihc6fqof.apps.googleusercontent.com">
<link rel="stylesheet" href="<?= $baseurl?>css/animate.css">
<link rel="stylesheet" href="<?= $baseurl?>css/style.css">
<link rel="stylesheet" href="<?= $baseurl?>css/player.css">
<title>Radio Shqip</title>
<base href="/">
</head>
<body ng-app="musiclistener">
<span ng-cloak>
<span ng-view ></span>
</span>
<div id='player-container'>
<audio controls id='music-player' src="#"></audio>
<div class='container-fluid'>
<div class='col-sm-1 col-xs-3 text-center' id='play-icon-container'>
<i class='fa fa-play-circle' id='play-btn' ng-click="playtoogle()"></i>
</div>
<div class='col-sm-1 center-block hidden-xs' id='podcast-icon-container'>
<img src="{{ playerthumb }}" id='play-img' class='img-responsive center-block' style="margin-top:7.5px">
</div>
<div class='col-md-6 col-sm-4 col-xs-6' id='podcast-bar-container' style="margin-top:17px">
<span style='color:#fff;position:relative;top:3px;text-transform:capitalize' ng-if="musicplayingentity">{{ musicplayingentity}}</span>
<div id='podcast-progress'>
<div id='podcast-id-value'></div>
</div>
</div>
<div class='col-md-1 col-sm-2 text-center hidden-xs' id='addons-icon-container'>
<span ng-hide="userLoggedIn">
<a href data-toggle="modal" data-target="#loginModal"><i class='fa fa-heart-o pull-left'></i></a>
<a href data-toggle="modal" data-target="#loginModal"><i class='fa fa-comment-o '></i></a>
</span>
<span ng-show ="userLoggedIn">
<i ng-click="makeFavoritePlayer()" ng-hide="playingfav" class='fa fa-heart-o extrafun'></i>
<i ng-click="removeFavoritePlayer()" ng-show="playingfav" class='fa fa-check extrafun'></i>
<i ng-click="showCommentBoxPlayer()" class='fa fa-comment-o'></i>
</span>
<i class='fa fa-share-alt pull-right' ng-click="shareboxPlayer(shareslug)"></i>
</div>
<div class='col-sm-3 col-xs-3 text-center' id='volume-container'>
<div class='col-xs-2'>
<i class='fa fa-volume-up'></i>
</div>
<div class='col-xs-1 col-md-9' style="margin-top:20px">
<div id='volume-progress'>
<div id='volume-id-value'></div>
</div>
</div>
</div>
</div>
</div>
<script src="https://apis.google.com/js/platform.js" async defer></script>
<script src="<?= $baseurl?>ang/angular.min.js"></script>
<script src="<?= $baseurl?>ang/angular-sanitize.min.js"></script>
<script src="<?= $baseurl?>ang/angular-route.min.js"></script>
<script src="<?= $baseurl?>ang/angular-cookies.min.js"></script>
<script src="<?= $baseurl?>ang/angular-facebook-sdk.js"></script>
<script>
window.fbAsyncInit = function()
{
FB.init({ appId : '195962897544265', xfbml : true, version : 'v2.8' });
};
</script>
<script src="<?= $baseurl?>ang/app.js"></script>
<script src="<?= $baseurl?>ang/controllers.js"></script>
<script src='<?= $baseurl?>js/jquery-1.7.2.min.js'></script>
<script src='<?= $baseurl?>js/bootstrap.js'></script>
<script src='<?= $baseurl?>js/typed.js'></script>
<script src='<?= $baseurl?>js/wow.js'></script>
<script src='<?= $baseurl?>js/player.js'></script>
<script type="text/javascript" src="<?= $baseurl?>js/script.js"></script>
<script type="text/javascript" src="<?= $baseurl?>ang/core.js"></script>
<script>
new WOW().init();
</script>
<script>
$(function(){
$(".typing-text").typed({
strings: ["MUSIC", "SPORTS", "BOOKS", "NEWS", "TALK"],
typeSpeed: 200,
backSpeed: 150,
loop: true
});
});
</script>
</body>
</html>
and home-track.html in template folder where I want to add my Adsense Ad unit code and to show there:
<section id="device" class="ng-scope" ng-controller="recentStation">
<div class="info_section_inner">
<div class="info_section_col" style="float: center;">
<p>
AAAA
</p>
</div>
<div class="container wow fadeIn" style="visibility: visible; animation-name: fadeIn;">
<div class="list_stations medium">
<div class="list_header clearfix">
<div class="stations-heading-h2 ng-binding" style="margin-bottom:25px; padding-top:25px; color:#000000;" ><p style="font-family:calibri; font-size:45px;">
Recent stations
</div>
</div>
<div class="list_body">
<div style="float: right; margin: 10px 0px 10px 10px;">
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- Shqipradio2 -->
<ins class="adsbygoogle hidead"
style="display:inline-block;width:300px;height:600px"
data-ad-client="ca-pub-123456789123456"
data-ad-slot="1234567890"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
<!-- ngRepeat: chn in channels --><div class="list_item ng-scope" ng-repeat="chn in channels">
<div class="bg">
<a class="image_outer" href="channel/{{chn.slug}}"> <span class="image"><img ng-src="{{chn.channel_image}}" alt="tea cup match" style="overflow:hidden;" width="100%" height="100%" itemprop="image" src="{{chn.channel_image}}" class="hoverZoomLink"></span>
<span class="overlay">
<!-- -->
</span>
<span class="country ng-binding"></span>
</a>
<div class="name" itemprop="name" >
{{chn.channel_name}}
</div>
</div>
</div>
</div>
<div class="list_footer clearfix">
All stations
<br>
</div>
</div>
</div></section>
So when I paste the ad unit code in index.php everything is good but the ads showing up before header or after footer, so I want to implement in home-track.html and to show here I want. When I paste the code to home-track.html there is the space for ads like my height and weight but ad is not showing up.
PS. I don't want to implement quickads from adsense, just to paste my Ad Unit code.
I have paste also my quick ad code in index.php but I will remove from there.
thanks
when I paste this code its working:
<style>
#media (max-width: 480px) {
.hidead {
display: none !important;
}
}
</style>
<div style="float: right; margin: 10px 0px 10px 10px;">
<iframe width="300" height="600" frameborder="0" class="adsbygoogle hidead"
src="https://googleads.g.doubleclick.net/pagead/ads?client=ca-pub-
123456789123456&output=html&h=600&slotname=1234567890&">
</iframe>
</div>
its everything good the ads are in the place where I want to be. But why when I paste the code that google give to me doestn show:
<style>
#media (max-width: 480px) {
.hidead {
display: none !important;
}
}
</style>
<div style="float: right; margin: 10px 0px 10px 10px;">
<script async
src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<!-- Shqipradio2 -->
<ins class="adsbygoogle hidead"
style="display:inline-block;width:300px;height:600px"
data-ad-client="ca-pub-123456789123456"
data-ad-slot="1234567890"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</div>
Its something wrong to use this code with