volteq Posted May 17, 2023 Posted May 17, 2023 we have some pictures and files for download in the /files/public folder. Google is complaining that the font is too small for mobile device. how can I change the font for viewing the files here? thanks in advance Quote
bsmither Posted May 17, 2023 Posted May 17, 2023 For download? That is, download - not viewing within a web page - but perhaps still using a web browser? If actually fetching an image by a web browser, it will be the browser's responsibility to scale the image to fit the screen. Same for a plain text file - which has no styling. If the files are PDF's, then that text has already been styled and laid out, where the browser, with its internal PDF viewer, has only the option to zoom in/out but likely cannot reflow the text to fit the screen. So, what is the nature of the files? Quote
volteq Posted May 17, 2023 Author Posted May 17, 2023 Sorry I did not make it clear. I was referring viewing the list of files, maybe this link will illustrate the point: https://www.volteq.com/files/public/manuals/ on mobile device the font is really small, and google complained about it. is there a way to change the font? Quote
bsmither Posted May 18, 2023 Posted May 18, 2023 Asking the web server to show the contents of a folder as a list requires the web server to populate a "directory list" template. A default template is part of the web server internals, and some web servers have an external module available that adds just a bit more layout and styling. Please review the hits from this internet search: https://duckduckgo.com/?q=web+server+index+listing+styling&ia=web CubeCart has no role in gathering, formatting, styling, and displaying contents of a folder to a customer. (In admin, of course, you need a list of images, digital downloads, backup files, etc, but what is shown to the admin is not a direct listing.) Quote
volteq Posted May 18, 2023 Author Posted May 18, 2023 thank you for your information. I created index.php and style.css files, and was able to manipulate the format somewhat. the funny thing is that I can change the fonts on the desktop, but on the mobile device it does not seem to respond to the style sheet. Here is my .css file content: table { border-collapse: collapse; width: 90%; } th, td { text-align: left; padding: 5px; border-bottom: 1px solid #ddd; font-family: Arial, sans-serif; font-size: 20px; } th { background-color: #4CAF50; color: white; } p { font-family: Arial, sans-serif; padding: 2px; font-size: 20px; } tr:nth-child(even) { background-color: #f2f2f2; } @media only screen and (max-width: 600px) { body { font-size: 18px; } } Quote
bsmither Posted May 18, 2023 Posted May 18, 2023 I am having trouble getting to: https://www.volteq.com/files/public/manuals/index.php Quote
volteq Posted May 18, 2023 Author Posted May 18, 2023 thanks for your help. I have hence added the index.php, and it should be working now. the css file was actually good, but my index.php file was missing a line to set the view port. In case someone also was working on something similar, here is the index.php: <!DOCTYPE html> <html> <head> <title>Directory Listing</title> <link rel="stylesheet" type="text/css" href="style.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <h1>Directory Listing</h1> <table> <thead> <tr> <th>Name</th> <th>Last Updated</th> </tr> </thead> <tbody> <?php $files = scandir('.'); foreach ($files as $file) { if ($file != '.' && $file != '..' && $file != 'index.php' && $file != 'style.css' && $file != '.htaccess' ) { $last_modified = date('M j, Y g:i A', filemtime($file)); echo "<tr><td><a href=\"$file\">$file</a></td><td>$last_modified</td></tr>"; } } ?> </tbody> </table> </body> </html> Here is the link to the directory, in case you want to see how it looks like: https://www.volteq.com/files/public/ Quote
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.