Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Help with PHP

What's a good program to use to edit it though?

Look... you should've asked the person who made the website for you, before he started the job, hoiw you can easily edit the website. But you didn't and now you're stuck with a static website that can only be edited by someone that knows how to do that through a code/text editor like your Firstpage editor.

Web Development php
rproffitt commented: Better explanation than mine! +15
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Help with PHP

I've necer heard of Firstpage, but perhaps you meant FrontPage (ancient WYSISWYG editor... not even know it still excist)? Anyway usually there should be a CMS (Content Management System) behind it for easy editing, but if that's not the case then a code editor is your only option.

Web Development php
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: How can i show my website only display on a mobile phone not in pc

Search for browser and device detection plugin if you really have to.

Web Development display wordpress
rproffitt commented: Yes. At least folk here can work around that. +15
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: jQuery Datepicker: Set Current Date

Add your JS before the closing </body> tag.

Web Development javascript javascript-jquery
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: jQuery Datepicker: Set Current Date

Add the current date (today) dynamically.

with PHP:

<input id="datePicker" type="date" value="<?php echo date('Y-m-d'); ?>" />

or with JS:

let today = new Date().toISOString().substr(0, 10);
document.querySelector("#datePicker").value = today;

EDIT: off-topic, but where is your doctype declaration? And those meta tags on the first 2 lines should be between the <head> tag.

Web Development javascript javascript-jquery
Jon_7 commented: Great adds. I'll try to take care of that doctype now. Thx for the JS as well +1
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: How to control google bussiness

I guess the OP means Google My Business.

Cloud-based Apps google lan-wan
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: animate all borders at same time

I haven't used GSAP before too, because for complex anmiations I resort to http://animejs.com/

But... if I can do simple animations such as your border animation witrh CSS and a few lines of HTML & JS, then that's the first route I'd take. Especially with big projects, you want to keep things as lightweight as possible to have a speedy website.

If you have to create also compex animations with lot's of sequences, then do those with GSAP.

Anyway...

TweenLite.fromTo animates all borders at same time, but it only works for first animation i.e. .animate1

If I click on animate1 button in your jsfiddle, then all the borders don't animate at the same time. If the 1st border animation has finished it starts the 2nd border animation and after that the 3rd and so on.
As far as I can tell this is how it should be with TimelineLite()So I'm not sure why you say they all animate at the same time.

Web Development javascript javascript-jquery
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Ajax Tabs, half working

It's because the third through 5th tabs have an error.

Web Development javascript
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: animate all borders at same time

Although I do find it a lot of code for such a simple animation. Are you planning to use GSAP more in this project or is it only for this animation? None the less it's a lot of CSS and HTML (with loads of empty div tags to create faux borders).

I couldn't resist to play with animated borders as well :) but I've used ::before and ::after pseudo elements to create faux borders and CSS transitions for the animations. The only JS used is to trigger the border animation with the button. No libraries involved.

https://codepen.io/gentlemedia/pen/XPePbq

HTML:

<div class="box">
  <h1 class="title">border animation</h1>
</div>

<button>button</button>

CSS:

.box {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  width: 400px;
  height: 200px;
  margin: 100px auto 40px;
  border: 1px solid #eee;
}

.box::before,
.box::after,
.title::before,
.title::after {
  content: " ";
  position: absolute;
  background-color: #666;
  transition: .5s;
}

.box::before,
.box::after {
  width: 0;
  height: 1px;
}

.box.borders::before,
.box.borders::after {
  width: 100%;
}

.title::before,
.title::after {
  height: 0;
  width: 1px;
}

.box.borders .title::before,
.box.borders .title::after {
  height: 100%;
}

.box::before,
.title::before {
  top: 0;
  left: 0;
}

.box::after,
.title::after {
  bottom: 0;
  right: 0;
}

JS:

var box = document.querySelector('.box');
var button = document.querySelector('button');

button.onclick = function() {
  box.classList.toggle('borders');
}
Web Development javascript javascript-jquery
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: animate all borders at same time

Ah ok... apologies for assuming that!

Web Development javascript javascript-jquery
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: animate all borders at same time

The author of that jsfiddle (which is not you obviously) used GSAP and then in particular the TimeLineLite plugin, so if you want to make your own adjustments to the sequence of the border animation, you have to learn first how the TimeLineLite plugin works in regards to its sequence method.

https://greensock.com/docs/TimelineLite

Web Development javascript javascript-jquery
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: htaccess redirect to mobile subfolder without changing the URL

Sorry to say this, but user agent sniffing was/is never a good strategy. Just make your site mobile friendly, so you don't have to alter/update multiple code bases and your URLs work everywhere!

Web Development apache
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Best do follow link for blog commenting

Blog commenting with irrelevant spammy backlinks will hurt your SEO, so if you still want to get something out of this old school backlink strategy, you better want to do this right. So you have to put really some effort into this which means placing comments that add value to the article or blog post which should be related to the core bsusiness of the website you (back)link to.

https://blog.monitorbacklinks.com/seo/blog-commenting-seo/

EDIT: Oh and dofollow or nofollow... it doesn;t matter. Google doesn;t do anything with links in blog comments other then penalizing if it's a backlionk to an irrelebvant resource/website.

Search Engine Strategies seo
rproffitt commented: True. In another forum, requests come in to remove links due to the penalty. +15
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Can anybody help me please? How to create the same contact form?

I assume you mean the realtime chat/messaging functionality which iis a free script to implement from https://www.tawk.to/

But the link (and anchor text you used) to that site smells spammy to me too.

Web Development javascript
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Trying to understand animation.js

You forgot to copy the CSS that belongs to the classes line and square. You can see the accosiated CSS by using inspect or inspect element (right click context menu in your browser) pointing on a square.

Web Development javascript
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: html, css

You have to be way more clear what you want and your thread title is poor too. Read this - https://www.daniweb.com/programming/threads/435023/read-this-before-posting-a-question - and then try again!

Web Development html-css javascript
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: How to add audio effects to website using jquery

Greensock si for animations and has nothing to do with audio. For the rest what rproffitt said.

Web Development audio javascript javascript-jquery
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Issue with showing/hiding content on hover in css and jquery

In order to show/hide the content with a CSS transition you should use max-height instead of height and set overflow to hidden.

See n example here: https://codepen.io/gentlemedia/pen/QBYOWd

Web Development html-css javascript-jquery
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Help with Modified CSS Reset

Do websites need to look exactly the same in every browser?

Having said that I advise you again to use normalize.css, because that's the way to go nowadays. If you write your own base styles in your CSS, you will overwrite lots of browser default CSS anyway.
And for the responsive fluid typugraphy I gave you already the trick to do so, but you will have to study a bit yourself about this technique and decide for yourself what suits best for the fonts and the type of layout you use in your project.

Web Development audio html-css ruby
rproffitt commented: I made a batch of cookies. They don't look all the same but still delicious. +15
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Help with Modified CSS Reset

Don't just copy/patse stuff from several CSS resets into your own unless you know what these CSS decleration do. Like now you're also repeating a lot of porperties.

I'd recommend to just stick with normalize.css and for typography it doesn't make sense anymore to reset your headings since RWD became the norm. Better look into responsive fluid typography which give you something like so:

:root {
    font-size: calc(.75rem + 1vw);
}

There are several ways of doing this but via google you find lots of articles written about this technique.

Web Development audio html-css ruby
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Should I Have A Digital Marketing Strategy For My Business?

According to your prifile you work for a digital marketing agency, so why not ask your boss?

Digital Marketing seo social-media
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Article Submission Sites

Article submission sites for SEO are a thing of the past allready for a long time. Google’s Panda algorithm update killed article submission sites from 2011 onwards, so your article link is buried deep in the SERP's for no one to find and your backlinks have zero effect. Nobody visits these sites these days anyway, so no boost in traffic also.

https://searchengineland.com/google-panda-two-years-later-real-impact-149519

Thus.... stop waisting your time on this!

Search Engine Strategies seo
rproffitt commented: I've had such discussions and they come back with "It used to work." (Get over it!) +15
happygeek commented: Absotootely spot on... +16
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Load content without redirecting page using window.history.pushState

Did you checkout this pushState and AJAX tutorial"
https://css-tricks.com/using-the-html5-history-api/

Web Development html-css php
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Biggest DaniWeb pain points

I really hope that you do also something against these sig posters, because they're posting meaningless questions/answers and dragging up old threads from the death, just to have some backlinks in their sig.

Meta DaniWeb daniweb-feedback
ryantroop commented: Maybe a minimum quality score to enable sigs? +0
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Start animation when the section is scolled into view

Great! I'm glad it's sorted! And please mark this thread as solved!

Web Development
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Start animation when the section is scolled into view

I've just included the formatter in my codepen and it works fine.

Web Development
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Start animation when the section is scolled into view

There are a couple of things wrong with your implementation.

$(window).on('resize scroll', function() {

    $('.timer').countTo('start') ({

        formatter: function (value, options) {
            return value.toFixed(options.decimals).replace(/\B(?=(?:\d{3})+(?!\d))/g, ',');
        },
        onUpdate: function (value) {
            console.debug(this);
        },
        onComplete: function (value) {
            console.debug(this);
        }

    });

});

You run the timer as soon as you scroll and not when the circles div is in the viewport, because your forgot to wrap it inside if ($('.circles').isInViewport()) { ... )

The second things is that you wrote the .countTo(start) ({..}) wrong. That should have been .countTo({...}).

I was playing myself a bit with it too and I've noticed that the numbers were indeed acting a bit weird even when I had fixed your errors and yes, it was also resetting to 0 when I scrolled a bit more up and/or down while the counter was not finished yet.
I've fixed this by using the onUpdate: callback function to turn the window scroll and resizze events off once the counters had started

Like so:

$(window).on('scroll.count resize.count', function() {

    if ($('.circles').isInViewport()) {

        $('.timer').countTo({
            onUpdate: function () {
                $(window).off('scroll.count resize.count');
            }
        });

    }

});

I gave the window scroll and resize events a name of count, so that I can/should only turn these off and not possible other scroll or resize events that you (might) use for the other animations on the page.

I've also added a -500px offset in the viewport function, see below, so that the counters start a bit earlier while the circles div is noi fully yet at …

Web Development
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Start animation when the section is scolled into view

There are indeed many plugins for this, but if it's just for this one animation then you can/should do it without a plugin. I see you use a jquery plugin for the counters and trigger them on page load, but you have to trigger them when the circles div is in the viewport.

So with the code from that 'do it without a plugin' article, you could do something like this:

<script>

    $.fn.isInViewport = function() {
        var elementTop = $(this).offset().top;
        var elementBottom = elementTop + $(this).outerHeight();

        var viewportTop = $(window).scrollTop();
        var viewportBottom = viewportTop + $(window).height();

        return elementBottom > viewportTop && elementTop < viewportBottom;
    };

    $(window).on('resize scroll', function() {

        if ($('.circles).isInViewport()) {

            $('.timer').countTo({
                from: 0,
                to: 5,
                speed: 1000,
                refreshInterval: 20000,
                onComplete: function(value) {
                    console.debug(this);
                }
            });

            $('.timertwo').countTo({
                from: 0,
                to: 11,
                speed: 1000,
                refreshInterval: 20000,
                onComplete: function(value) {
                    console.debug(this);
                }
            });

            $('.timerthree').countTo({
                from: 0,
                to: 7064,
                speed: 1000,
                refreshInterval: 20000,
                onComplete: function(value) {
                    console.debug(this);
                }
            });

        }

    });

</script>
Web Development
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Add Active Navigation Class Based on URL for Tabs

I have another suggestion and that is using the HTML5 History API (pushState and AJAX) for this. This will also work with the browser back button and you don't get all this content in one document unlike your tab implementation.

Here's a little tut and example demo:
https://css-tricks.com/using-the-html5-history-api/

Web Development javascript
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: how to make multi-vendor website like amazon

Why do you wanna create something like this from scratch and if so how you think you gonna do that in a vacation time? Unless your vacation spans months and months and months :)
Why not just use something like https://www.cs-cart.com/multivendor.html and build further ontop of that?

Web Development javascript mysql php sql
rproffitt commented: Exactly. But they did lead with "i would like to do everything" or without building on prior works from what I read. +15
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: online pdf viewer programming code

Wow! Downvoting a post, because it's not the answer you're after. Have some respect, sir! Anyway... I've got a good answer for you. Hire a developer!!!

Web Development pdf
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: online pdf viewer programming code

Mozilla has an open source PDF viewer written in JS.
https://mozilla.github.io/pdf.js/

Web Development pdf
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: what is GSA Backlink?

@rproffitt - Thread started just for their signature backlinks.

Search Engine Strategies seo
rproffitt commented: I agree. Any company that lies about themselves is shady at best and a liar at worst. Who would go near them? +15
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: what is GSA Backlink?

Sigh... why would anyone here explain this if a simple Google search gives you already the answer?

Search Engine Strategies seo
rproffitt commented: To me it's spam at this point. The fact they lie about locations is troubling. +15
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Looking for an example of food and drink on a handheld device ?

I really have no clue what you're after.

¯_(ツ)_/¯

that run on your Iphone, Androi, winphone, restaurant, coffee shop...

¯_(ツ)_/¯

for example simple you have to share yourself with.

Web Development asp.net iphone sql
rproffitt commented: (☞ຈل͜ຈ)☞ +15
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Php

There are loads of ready made scripts for this. Here's for example a tiny javascript modal library with no dependency.
https://github.com/oigil/dndod / https://oigil.github.io/dndod/demo

Or do you need a more robust soluttion with tons of options and with support for older browsers such as old IE, then you could go for https://craftpip.github.io/jquery-confirm/

Web Development javascript mysql php
jkon commented: +1 for the no dependency +9
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Use an image for browse button

It's doanle, but not like that no.
Here a tut how to do it with CSS and a bit of JS and that also keeps accisibility in mind.
https://tympanus.net/codrops/2015/09/15/styling-customizing-file-inputs-smart-way/

Web Development html-css image php
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: table css

pty is right. Your CSS selectors don't make any sense.

You gave that table a class order, so target the td of that table properly like so:

.order td {
    width: 5px;
}

But Like pty said... what the heck do you want to display in a 5px width table cell? :)

Web Development html-css
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Do you know who Danny Sullivan is?

I don't think the OP is really interested in who does (or who doesn't) know Danny Sullivan. I think he/she is more interested in putting some backlinks in his/her sig.

If the OP was really in for some proper discussion, then he/she would have the decency to follow up on the replies of an earlier thread of his/her https://www.daniweb.com/digital-media/digital-marketing/search-engine-strategies/threads/515823/what-aspects-of-a-hyperlink-are-important-for-seo instead of posting a new one (this one) at that time.

Search Engine Strategies
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Advertisting (digital magazine + email marketing)

No, I was refering to just a PDF instead of a flipbook. Anyway... it looks nice a flipbook (if well designed) on a desk/laptop and tablet, but is useless on a phone and the majority of email opens these days are mobile.

Digital Marketing email pdf
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Advertisting (digital magazine + email marketing)

either embed it in my website and/or send it via mail

If you have a webshop with your products then there's no need to put it on your website too.
A flipbook in an email is too advanced for the email applications and software. If you want to do email marketing then you have to code your HTML (email) like it's 1999 and if you don't have experience with that, then there are always services like https://mailchimp.com/ or https://www.campaignmonitor.com/ which have ready made templates for free.

Sending a PDF brochure as attachement is not recommended for email marketing. Filesize of the email gets way too big, your prospects has to save the PDF first before they can open and read it. And reading a PDF on a smartphone is a terrible user experience, because they have to pinch/zoom in order to do so.

You can also buy email templates/themes on Themeforest, or the likes, which have there own email bulders integrated.
https://themeforest.net/category/marketing/email-templates?tags=campaign%20monitor,mailchimp#content

Digital Marketing email pdf
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: default margin-top of input['text'] tag ??

form { display: flex }

But you will need to add the necessary prefixes if you have/want to support older browsers and IE 10 uses even an older (discarded) version of the flexbox specification.
You could also use http://leaverou.github.io/prefixfree/ and be done with it.

UI / UX Design html-css
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: default margin-top of input['text'] tag ??

Set on both inputs a vertical-align: top and you can ditch the display: inline declarations, because inline is already the default display value for inputs.

Another thing;; there's a specific type="search" for your search field instead of using type="text".

UI / UX Design html-css
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: how to make border around page with multicolor ?

Creating faux borders with empty div tags is rubbush, so don't do that :)
And the position: absolute on them take them out of the normal document flow, which means they don't have effect on other elements on the page and that's why if your paragraph grows, it goes over it and don't push the bottom border down.

The border property don't overlap each other in the corners as you've noticed, so that's also not going to work.

But... what you want can be done with the border-image and border-image-slice properties.

The image I've created and use is this: https://projects.gentle.media/_img/border-image.svg

The CSS is:

/* These first 2 block are not needed for this to work,
 * but it will make your dev-life so much easier when 
 * creating responsive layouts.
 * More info here: https://css-tricks.com/box-sizing/
 */

html {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

*,
*:before,
*:after {
  -webkit-box-sizing: inherit;
  -moz-box-sizing: inherit;
  box-sizing: inherit;
}

/* ---------------------------------------- */

html {
  height: 100%;
}

body {
  min-height: 100%;
  padding: 20px;
  border: 20px solid transparent;
  border-image: url('https://projects.gentle.media/_img/border-image.svg') round;
  border-image-slice: 33.33333333%;
}

See demo: https://codepen.io/gentlemedia/pen/XZGrPL

UI / UX Design html-css
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: select don't this don't obey to CSS rules ( margin and position ) and other

I only had a look and see in project1 that you load first your own stylesheet and then the bootstrap stylesheet. Switch them!

Web Development css-bootstrap html-css
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: select don't this don't obey to CSS rules ( margin and position ) and other

Hard to tell withou seeing any code, but here's some info:

A select element is an inline element which means it has by default the CSS decleration display: inline in the browsers' computed stylesheet.
Top/bottom margin and padding don't have effect on inline elements. Only left/right margin and padding. Do you want top/bottom margin and padding on the select element, then you will have to change the display to inline-block or block in your CSS (depending on your situation)

select { display: inline-block )

/* or */

select { display: block }

An input tag is also by default an inline element, but you say the top margin has effect on them, so you probably have somewhere in your (Bootstrap ???) CSS already input { display: block }

Furthermnore don't use position: absolute to lay out your form elements/tags or for any other layout. It''s doable, but it has many disadvantages. Use it only for small things if you have to.

align-text is not a CSS property unless you mean text-alignand the vertical-align property has only effect on the table tags thead, tbody, , th and td or elements with a CSS property of display: table-cell or display: inline-block.

Personally I use flexbox for layout, because I knid of have/want to support IE10+

https://css-tricks.com/snippets/css/a-guide-to-flexbox/

Web Development css-bootstrap html-css
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: Parse only a certain amount of records of a JSON array

I figured this one out myself. There is a array_slice(), so I've added this to my foreach()and voila.

<?php

    $url = 'data/gigs.json';
    $data = file_get_contents($url);
    $gigs = json_decode($data, true);

    foreach (array_slice($gigs,0,5) as $gig) {
        echo '<tr>';
        echo '<td><time>' . $gig['date'] . '</time></td>';
        echo '<td>' . $gig['event_venue'] . '</td>';
        echo '<td>' . $gig['location'] . '</td>';
        if (empty($gig['tickets_url'])) {
            echo '<td></td>';
        } else {
            echo '<td><a class="btn btn-primary external" href="' . $gig['tickets_url'] . '">Buy</a></td>';
        }
        echo '</tr>';
    }

?>
Web Development json php
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Parse only a certain amount of records of a JSON array

I'm using file_get_contents() to parse data of a JSON file within a foreach() loop onto my page.

<?php

    $url = 'data/gigs.json';
    $data = file_get_contents($url);
    $gigs = json_decode($data, true);

    foreach ($gigs as $gig) {
        echo '<tr>';
        echo '<td><time>' . $gig['date'] . '</time></td>';
        echo '<td>' . $gig['event_venue'] . '</td>';
        echo '<td>' . $gig['location'] . '</td>';
        echo '<td><a class="btn btn-primary external" href="' . $gig['tickets_url'] . '">Buy</a></td>';
        echo '</tr>';
    }

?>

This works fine and I also want to parse this data onto the homepage, but this time I only want to parse let's say the first 5 records of the JSON array. I do know how to parse the first 5 individually, but not within this foreach loop. I tried Google for an answer, but probably used the wrong query :)

Web Development json php
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: New Google Webmaster Tools

Errr... ain't it called Search Console for quite some time now? Anyway... it still looks the same here in Greece, so probably you in the US are one of the first to have a look.

Digital Media google
Member Avatar for gentlemedia
gentlemedia 803 Master Poster
Re: SEO

Never ever go for a cheap SEO service!!!
https://www.youtube.com/watch?v=piSvFxV_M04

It's funny though that the cheap one is honest about him using black-hat techniques. Good SEO takes time and resources, but you can do a lot of on-page SEO yourself, because all the info how to do this properly is easy to find on the web. If you go for the cheap one with his shady techniques, you will regret it later.

Search Engine Strategies seo web-design